fountainjs / generator-fountain-vue Goto Github PK
View Code? Open in Web Editor NEWYeoman 'fountain' generator to start a webapp with Vue http://fountainjs.io
License: MIT License
Yeoman 'fountain' generator to start a webapp with Vue http://fountainjs.io
License: MIT License
Seems like really poor style to name a component Main, as when you do that you can't include it in a template as main is a keyword. the Vue CLI uses Home.vue instead and wraps everything in App.vue to reduce the need to subroute everything.
Also
Note that Vue does not enforce the W3C rules for custom tag names (all-lowercase, must contain a hyphen) though following this convention is considered good practice.
https://vuejs.org/v2/guide/components.html
Hello, I just setup a TodoMVC examples by fountainjs. I run a command: npm run serve. The brower is blank and console have a message:
Uncaught TypeError: _vue2.default.use is not a function
at Object. (index.js:6)
at webpack_require (bootstrap 73631b4…:19)
at Object. (index.js:5)
at webpack_require (bootstrap 73631b4…:19)
at bootstrap 73631b4…:63
at bootstrap 73631b4…:63
fatal: Remote branch 1681/head not found in upstream origin
When I try clicking checkbox to complete item it does nothing. Todo item remains undone.
When I try editing item text it becomes empty string after editing
Remove v-model
directive from toggle checkbox. Because at first checkbox change completed
property, then mutation change it again, so it remains same.
In Mutations only two parameters possible: state and payload. So it should be like this:
// in handleSave method inside TodoItem.vue
this.editTodo({id: this.todo.id, text: text});
// in mutations
[ActionTypes.EDIT_TODO](state, payload) {
state.todos = state.todos.map(todo =>
todo.id === payload.id ?
Object.assign({}, todo, {text: payload.text}) :
todo
);
},
Copy the content from .yo-rc.json
:
{
"generator-fountain-vue": {
"version": "1.0.0",
"props": {
"framework": "vue",
"modules": "webpack",
"js": "babel",
"ci": "",
"css": "scss",
"resolved": "/usr/local/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-vue/generators/app/index.js",
"namespace": "fountain-vue:app",
"_": [],
"sample": "todoMVC",
"router": "router"
}
}
}
Node.js v6.10.0
darwin 15.6.0
yo 1.8.5
npm 3.10.10
Don't know what caused this by now in my working javascript files I have following output.
'use strict';
var cov_1q4mhr3rjq = (function () {
let path = 'C:\\Users\\korSt\\Documents\\Vue\\PracaInz\\src\\store\\mutation-types.js',
hash = '295c6b828651756faa97f62ed8df5f6473f9783a',
global = new Function('return this')(),
gcv = '__coverage__',
coverageData = {
path: 'C:\\Users\\korSt\\Documents\\Vue\\PracaInz\\src\\store\\mutation-types.js',
statementMap: {
0: {
start: {
line: 3,
column: 21
},
end: {
line: 298,
column: 4
}
},
1: {
start: {
line: 4,
column: 13
},
end: {
line: 4,
column: 88
}
},
2: {
start: {
line: 5,
column: 11
},
let path = (++cov_1q4mhr3rjq.s[15], (++cov_1q4mhr3rjq.s[2], 'C:\\Users\\korSt\\Documents\\Vue\\PracaInz\\src\\store\\mutation-types.js')),
hash = (++cov_1q4mhr3rjq.s[16], (++cov_1q4mhr3rjq.s[3], '5566390f757c4e7a5b5d2573ad0359f1aedbe81f')),
global = (++cov_1q4mhr3rjq.s[17], (++cov_1q4mhr3rjq.s[4], new Function('return this')())),
gcv = (++cov_1q4mhr3rjq.s[18], (++cov_1q4mhr3rjq.s[5], '__coverage__')),
coverageData = (++cov_1q4mhr3rjq.s[19], (++cov_1q4mhr3rjq.s[6], {
path: 'C:\\Users\\korSt\\Documents\\Vue\\PracaInz\\src\\store\\mutation-types.js',
statementMap: {
It is just fragment, document is about 1000 lines long and my code is burred somewhere between.
I played a little with ESLint before that happend, but I'm not sure where is the problem.
As reported in FountainJS/fountainjs.github.io#31 , you appear to have lost control of the fountainjs.io domain (I can't tell from the whois info) or at the least the website has been hacked, as it redirects to what appears to be random websites!
You might want to change that, at least in the various GitHub projects that FountainJS maintains.
Hi guys,
if i run: gulp build or npm run build
it generates the css and js files of my app and vendor. However the vendor files are incomplete...
Vue is not found.
.yo-rc.json
{ "generator-fountain-vue": { "version": "1.0.0", "props": { "resolved": "C:\\Users\\liliana.iturribarria\\AppData\\Roaming\\npm\\node_modules\\generator-fountain-vue\\generators\\app\\index.js", "namespace": "fountain-vue:app", "_": [], "framework": "vue", "js": "babel", "modules": "webpack", "css": "less", "ci": [], "sample": "techs", "router": "router" } } }
Failed to run 'gulp build'
ERROR in ./~/todomvc-app-css/index.css
Module build failed: ModuleBuildError: Module build failed: Error: Cannot find module 'C:\myproject-path\node_modules\css-loader\index.js?minimize'
Child extract-text-webpack-plugin:
ERROR in ./~/css-loader?minimize!./~/sass-loader!./~/postcss-loader!./~/todomvc-app-css/index.css
Module build failed: Error: Cannot find module 'C:\myproject-path\node_modules\css-loader\index.js?minimize'
Hi! Vue-loader allows me to use <style> in component. But it throws an error
<template>
<h1>{{ text }}</h1>
</template>
<script>
export default {
name: 'myComponent',
data() {
return {
text: 'My new component'
};
}
};
</script>
<style>
h1{
color: red;
}
</style>
ERROR in ./~/css-loader?sourceMap!./~/vue-loader/lib/style-rewriter.js?id=data-v-3fd17fa2!./~/vue-loader/lib/selector.js?type=styles&index=0!./src/app/components/game/myComponent.vue
Module build failed: TypeError: Path must be a string. Received undefined
at assertPath (path.js:7:11)
at Object.relative (path.js:538:5)
at Object.<anonymous> (D:\Silversite\vue-fountain-test\node_modules\css-loader\lib\loader.js:101:19)
at Array.map (native)
at Object.<anonymous> (D:\Silversite\vue-fountain-test\node_modules\css-loader\lib\loader.js:99:31)
at D:\Silversite\vue-fountain-test\node_modules\css-loader\lib\processCss.js:199:3
at process._tickDomainCallback (internal/process/next_tick.js:129:7)
@ ./~/vue-style-loader!./~/css-loader?sourceMap!./~/vue-loader/lib/style-rewriter.js?id=data-v-3fd17fa2!./~/vue-loader/lib/selector.js?type=styles&index=0!./src/app/components/game/myComponent.vue 4:14-254
@ ./src/app/components/game/myComponent.vue
@ ./src/index.js
node v6.9.2
npm v3.10.9
yo v1.8.5
win64 6.1.7601
Description
docker build -t vue-app .
When building a docker image from generated Dockerfile, it fails in step # 4 attempting to install npm via git repo (error output below)
An additional command (to install git) is required to be able to proceed;
RUN apk update && apk upgrade && \
apk add --no-cache bash git openssh
Error output
Step 4/5 : RUN npm install
---> Running in a28fdedd2f4a
npm ERR! git clone --template=/root/.npm/_git-remotes/_templates --mirror [email protected]:gulpjs/gulp.git /root/.npm/_git-remotes/git-github-com-gulpjs-gulp-git-4ed9a4a3275559c73a396eff7e1fde3824951ebb-7c06e801: undefined
npm ERR! git clone --template=/root/.npm/_git-remotes/_templates --mirror [email protected]:gulpjs/gulp.git /root/.npm/_git-remotes/git-github-com-gulpjs-gulp-git-4ed9a4a3275559c73a396eff7e1fde3824951ebb-7c06e801: undefined
npm ERR! git clone --template=/root/.npm/_git-remotes/_templates --mirror [email protected]:frankwallis/gulp-hub.git /root/.npm/_git-remotes/git-github-com-frankwallis-gulp-hub-git-d461b9c700df9010d0a8694e4af1fb96d9f38bf4-41f2d061: undefined
npm ERR! git clone --template=/root/.npm/_git-remotes/_templates --mirror [email protected]:frankwallis/gulp-hub.git /root/.npm/_git-remotes/git-github-com-frankwallis-gulp-hub-git-d461b9c700df9010d0a8694e4af1fb96d9f38bf4-41f2d061: undefined
npm ERR! Linux 4.9.27-moby
npm ERR! argv "/usr/bin/node" "/usr/bin/npm" "install"
npm ERR! node v6.11.0
npm ERR! npm v3.10.10
npm ERR! code ENOGIT
npm ERR! not found: git
npm ERR!
npm ERR! Failed using git.
npm ERR! This is most likely not a problem with npm itself.
npm ERR! Please check if you have git installed and in your PATH.
npm ERR! Please include the following file with any support request:
npm ERR! /opt/app/npm-debug.log
Environment:
MacOS Sierra
Docker version 17.03.1-ce, build c6d412e
Node v6.11.0
NPM v5.0.3
Yeoman v2.0.0
Dockerfile
FROM mhart/alpine-node:6
WORKDIR /opt/app
ADD . /opt/app
RUN npm install
CMD ["npm","test"]
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.