🛠️ webpack-based tooling for Vue.js Development
Home Page: https://cli.vuejs.org/
License: MIT License
Vue CLI is now in maintenance mode. For new projects, please use create-vue to scaffold Vite-based projects. create-vue supports both Vue 2 and Vue 3.
Also refer to the Vue 3 Tooling Guide for the latest recommendations.
For information on migrating from Vue CLI to Vite:
Docs are available at https://cli.vuejs.org/ - we are still working on refining it and contributions are welcome!
Please see contributing guide.
![dependabot[bot] avatar](https://avatars.githubusercontent.com/in/29110?v=4 "dependabot[bot]")
Hi,
When you don't write the project name and just hit enter, the init is paused.
I work on Windows 10 with node 5.3.0 and the last vue-cli version.
I'm submitting the ability to download private repos as a separate issue from #14 because I'm not sure how or if you would like to use it. I made a minor release (non-breaking) change to flipxfx/download-git-repo that allows for private repos.
You can still doing the following for a normal http download:
download('owner/repo', 'tmp', function(err) {})But the new version allows you to use git-clone to download both public and private repos.
download('owner/repo', 'tmp', { clone: true }, function(err) {})The problem is that using git clone can be a bit slower (at least for Bitbucket). Due to this I'm not sure if the better way would be to use clone for all template downloads or if there should be an option to specify clone in the cli itself. It's not a ton slower but I didn't want to assume you were ok with the additional time to enable private repo downloads.
These are my stats from the tests in flipxfx/download-git-repo showing http download vs clone.
via github
✓ downloads the master branch by default (881ms)
✓ download branches too (428ms)
✓ downloads from github by default (734ms)
✓ clones the master branch by default (592ms)
✓ clones branches too (651ms)
via bitbucket
✓ downloads the master branch by default (189ms)
✓ download branches too (175ms)
✓ clones the master branch by default (1370ms)
✓ clones branches too (2040ms)
webpack 模板，我需要在html引入外部的js作为公共的库提供，但发现无论我怎么设置路径，开发模式下始终找不到引入的文件。例如下面这个
<body>
<app></app>
<script src="./lib/qrcode.min.js"></script>
</body>
但是如果用webpack-dev-server，就可以找到相应的目录
When running vue-cli on Windows 10 x64 it just completely freezes. The project scaffold is never generated and no output is shown.
If I add background-image: url('some-image.jpg') CSS property to some element it does now show up in my app inside browser... Any idea why?
Would love an npm install, or at least a message that it's needed.
when i used vue init webpack demo
it reported this error : " vue-cli · tunneling socket could not be established, cause=socket hang up"
First run on terminal: npm install es6-promise --save-dev
Edit /buid/webpack.base.conf.js adding require('es6-promise').polyfill();
Solution from here
使用vue的过程中，发现官方的配置是使用transform-runtime，但这个有一些es6的东西不能使用，比如Object.assign,然后我就添加了一个babel-polyfill,但发现polyfill和transform-runtime同时使用的话，会有重复代码，比如polyfill里面已经有Promise和regenerator,但transform-runtime也会自己添加这些东西，所以我就一直很疑惑这个东西到底该怎么配置？
Hi,
I'm currently thinking about building a standalone component template.
Files:
/src/comp.vue
/dev/env.vue
/test/comp.js
/comp.js
/.gitignore
/.project.json
/README.md
Tasks
npm run build # uses vue-compiler to compile /src/comp.vue to /comp.js
npm run test # uses Karma to test /comp.js
npm run dev # uses vue-dev-server to serve /dev/env.vue which loads /src/comp.vue
What do you think?
I've seen, that the other templates are with html, css, es2015 and karma+jasmine.
So I would use that as well..
I understand that the creators of vue do not use semi colons as a convention, and that is completely fine. However, some teams, including mine, have adopted the use of semicolons as a convention as well.
It would be great if we could have the option of choosing which convention we want to use, because I really love the official template, but have to manually add semicolons everywhere in the code to catch up.
Perhaps something like a --semicolons flag, or we could also include it in #5 . I would love to contribute towards this effort. Thoughts?
vue-cli incorrectly handles "dev" command in Windows environment.
When I try to start:
npm run dev
it hangs before http server starts. It's because of "&" sign to run browserify-hmb in background and then run http-server. Windows command-line interpreter doesn't allow to chain commands that way, it should be two separate lines, first one should be preceeded by start /b following-command-line.
As a solution you could create two scripts with the same name, but first one without extension for unix-likes, second with '.cmd' on the end for windows.
Hope you can fix this.
node -v: v5.2.0
npm WARN deprecated [email protected]: graceful-fs version 3 and before will fail on newer node releases. Please update to graceful-fs@^4.0.0 as soon as possible.
npm WARN deprecated [email protected]: lodash@<3.0.0 is no longer maintained. Upgrade to lodash@^4.0.0.
Hello,
I've been trying to get my breakpoints in chrome to show the proper line while debugging an app generated with vue-cli. Usually the problem I have is : The breakpoint stops execution properly but my app really is 2 lines up or down.
An example :
var a = 1;
a++; <-- breakpoint
a++;
When chrome stops execution, a is either 1 or 3 instead of 2.
I figured the problem should come from webpack, and found that changing :
config.devtool = 'eval-source-map' to config.devtool = 'source-map' solves the issue. (And also has easier names for files when debugging).
I tried to understand how the change solved the issue but no luck there... I'm still a beginner with webpack.
Not sure what's going on, but whenever I build my code, it hangs at around 50%.
Is there a way to make the build process output anything, so I can see where it halts?
Just init a bran new project with
$ vue init webpack vocabulary2
I just got this error eol-last Newline required at end of file but not found syntax on Home.vue.
But the Newline is there. And I have no idea where '//' come from.
My environment setup:
I want to init a webpack template in my current project my/project folder by running
➜ my/project vue init webpackinstead of jumping out and run $ vue init webpack my/project.
How to do it?
.vue file
this is code
`<style>
.regist {
margin-top: 86px;
border: 1px solid lightgray;
border-radius: 4px;
padding: 20px;
}
.regist-login-link {
display: block;
margin-top: 10px;
}
.login-icon {
width: 100%;
background: url('https://dn-coding-net-production-static.qbox.me/5aad72f4-a78e-433a-815b-3a991794f4ba.jpg') no-repeat;
background-position: center center;
overflow: hidden;
overflow-y: hidden;
height: 100vh;
}
</style>
<div class="regist col-sm-4 col-sm-offset-4">
<p class="regist-title">用户登陆</p>
<validator name="validationLogin">
<form role="form" novalidate>
<div class="form-group">
<input type="text" class="form-control" placeholder="用户名" v-validate:username="{minlength:5,maxlength:12,required: true}" autocomplete="off" v-on:focus="scope.setFormaaa($event)">
</div>
<div v-if="$validationLogin.username.dirty && $validationLogin.username.invalid">
<p style="color: #ffffff">用户名不符合要求</p>
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="密码" v-validate:password="{minlength:5,maxlength:12,required:true}" autocomplete="off" v-on:focus="setFormaaa($event)">
</div>
<div v-if="$validationLogin.password.dirty && $validationLogin.password.invalid">
<p style="color: #ffffff">密码不符合要求</p>
</div>
<div class="form-group">
<input type="checkbox"><span>记住我</span>
<a href="#" class="pull-right">找回密码</a>
</div>
<button type="button" class="btn btn-primary center-block" v-bind:disabled="$validationLogin.invalid" v-on:click="login()">登陆</button>
</form>
</validator>
<a href="/regist" class="regist-login-link pull-right">没有账户？马上注册</a>
</div>
</div>
}
</script>`
have problem Uncaught TypeError: Cannot read property 'setFormaaa' of undefined(anonymous function) @ VM5242:3handler @ vue.common.js?e881:8108 VM5244:3 Uncaught TypeError: scope.setFormaaa is not a function(anonymous function) @ VM5244:3handler @ vue.common.js?e881:8108 7VM5249:3 Uncaught TypeError: scope.login is not a function
Looks like url-loader does not solve out web fonts in my CSS files ok... My main CSS file is included in main.js like this:
import './assets/scss/main.scss'
in the css I reference some web fonts
@font-face {
font-family: 'pages-icon';
src:url('../fonts/pages-icon/icons.eot?-u69vo5');
src:url('../fonts/pages-icon/icons.eot?#iefix-u69vo5') format('embedded-opentype'),
url('../fonts/pages-icon/icons.woff?-u69vo5') format('woff'),
url('../fonts/pages-icon/icons.ttf?-u69vo5') format('truetype'),
url('../fonts/pages-icon/icons.svg?-u69vo5#Pages-icon') format('svg');
font-weight: normal;
font-style: normal;
}
The icons aren't loaded by the browser. I then tested npm run build and investigated the build and the fonts files are included in the static folder but not sure why are not loaded when I run app in the browser.
My font loaders in the webpack config are:
{
test: /\.woff/,
loader: 'url?prefix=font/&limit=10000&mimetype=application/font-woff'
}, {
test: /\.ttf/,
loader: 'file?prefix=font/'
},
{
test: /\.eot/,
loader: 'file?prefix=font/'
},
{
test: /\.svg/,
loader: 'file?prefix=font/'
},
Any idea?
I would like create a vue-cli template that prompts users to select which libraries (js libraries, css preprocessor, etc) to install. Here's a screenshot from a yeoman generator that lets users pick one css preprocessor and multiple angular libraries.
Is it possible to have multiple choice prompts using vue-cli?
I just npm installed vue-cli and did same task as instructed npm run dev is working fine but when i do npm run build i got following error message
> vue-project@ build /var/www/html/vue-lab2/vue-project
> rimraf dist && webpack --progress --hide-modules --config build/webpack.prod.conf.js
Hash: f8302fe592cda5dae1c2
Version: webpack 1.12.11
Time: 2888ms
Asset Size Chunks Chunk Names
app.1c5e9c5cf5fc998a31b4.js 89.4 kB 0 [emitted] app
app.1c5e9c5cf5fc998a31b4.js.map 687 kB 0 [emitted] app
../index.html 207 bytes [emitted]
ERROR in ./src/App.vue
Module not found: Error: Cannot resolve 'file' or 'directory' ./../../../../../../vue-lab2/vue-project/node_modules/extract-text-webpack-plugin/loader.js in /var/www/html/vue-lab2/vue-project/src
@ ./src/App.vue 2:0-352
this is my package.json
{
"name": "vue-project",
"description": "This is to test basic vue structure",
"author": "Sunny Rajkotiya <[email protected]>",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --hot --config build/webpack.dev.conf.js",
"build": "rimraf dist && webpack --progress --hide-modules --config build/webpack.prod.conf.js",
"test": "karma start build/karma.conf.js --single-run"
},
"dependencies": {
"vue": "^1.0.0"
},
"devDependencies": {
"babel-core": "^6.0.0",
"babel-loader": "^6.0.0",
"babel-plugin-transform-runtime": "^6.0.0",
"babel-preset-es2015": "^6.0.0",
"babel-preset-stage-2": "^6.0.0",
"babel-runtime": "^5.8.0",
"css-loader": "^0.23.0",
"eslint": "^1.10.3",
"eslint-friendly-formatter": "^1.2.2",
"eslint-loader": "^1.2.0",
"extract-text-webpack-plugin": "^0.9.1",
"file-loader": "^0.8.4",
"function-bind": "^1.0.2",
"html-webpack-plugin": "^1.7.0",
"inject-loader": "^2.0.1",
"jasmine-core": "^2.4.1",
"json-loader": "^0.5.4",
"karma": "^0.13.15",
"karma-jasmine": "^0.3.6",
"karma-phantomjs-launcher": "^0.2.1",
"karma-spec-reporter": "0.0.23",
"karma-webpack": "^1.7.0",
"phantomjs": "^1.9.19",
"rimraf": "^2.5.0",
"url-loader": "^0.5.7",
"vue-hot-reload-api": "^1.2.0",
"vue-html-loader": "^1.0.0",
"vue-loader": "^8.0.0",
"vue-style-loader": "^1.0.0",
"webpack": "^1.12.2",
"webpack-dev-server": "^1.12.0"
}
}
i have npm version 3.3.12
I tried all solutions mentioned in vuejs/vue-loader#70 ,webpack/webpack#981, also tried adding resolve.root = resolve.path(__dirname,"node_modules") or resolveLoader: {
root: path.join(__dirname, 'node_modules')
}
but nothing worked
I installed the full webpack scaffolding package. It's running fine, but if I change the main index.html file it's not automatically reloaded. Do I need to add something to Webpack config in order to enable this?
After vue init webpack my-project and npm run dev I couldn't figure out where to put the usual [v-cloak] { display: none }, because even if I used something like require('./assets/cloak.css') I still saw my vue placeholders for a second.
Currently I have a <style> tag in my index.html which fixes this cloaking issue, but if there's a way to load static content like 3rd party stylesheets with the dev server, I'd really appreciate if someone could show an example code.
$ npm install -g vue-cli
npm WARN deprecated [email protected]: This package was split into two
simpler plugins: metalsmith-layouts and metalsmith-in-place
C:\Users\DualWield\AppData\Roaming\npm\vue -> C:\Users\DualWield\AppData\Roaming\npm\node_modules\vue-cli\bin\vue
[email protected] C:\Users\DualWield\AppData\Roaming\npm\node_modules\vue-cli
├── [email protected]
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected])
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
├── [email protected] ([email protected])
└── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
and then whatever commands I input, get a error like this
$ vue init webpack my-project
events.js:141
throw er; // Unhandled 'error' event
^
Error: spawn c:\Users\DualWield\AppData\Roaming\npm\node_modules\vue-cli\bin\vue-init ENOENT
at exports._errnoException (util.js:874:11)
at Process.ChildProcess._handle.onexit (internal/child_process.js:178:32)
at onErrorNT (internal/child_process.js:344:16)
at doNTCallback2 (node.js:439:9)
at process._tickCallback (node.js:353:17)
at Function.Module.runMain (module.js:469:11)
at startup (node.js:134:18)
at node.js:961:3
$ vue list
events.js:141
throw er; // Unhandled 'error' event
^
Error: spawn c:\Users\DualWield\AppData\Roaming\npm\node_modules\vue-cli\bin\vue-list ENOENT
at exports._errnoException (util.js:874:11)
at Process.ChildProcess._handle.onexit (internal/child_process.js:178:32)
at onErrorNT (internal/child_process.js:344:16)
at doNTCallback2 (node.js:439:9)
at process._tickCallback (node.js:353:17)
at Function.Module.runMain (module.js:469:11)
at startup (node.js:134:18)
at node.js:961:3
My env environment is
$ node --version
v4.2.1
$ npm --version
2.14.7
win7 + git bash
Thanks
Initializing a new project produces the following error:
$ vue init my-project
Generate project in current directory?: (Y/n) Y
vue-cli · Response code 404 (Not Found)
The npm run dev command can run without any problem, but i can see nothing in the browser with localhost:8080.
The lsof command shows:
lsof -i :8080
COMMAND PID USER FD TYPE DEVICE SIZE/OFF NODE NAME
node 24732 Calvin 24u IPv4 0xb6920191477c7e03 0t0 TCP localhost:http-alt (LISTEN)
So i'm sure no other applications bind this port, when i change the port in dev-server.js to 8090, it worked.
<component v-bind:attr="..." attr-one="..." attr-two="..." /></component>Using the full webpack template. The above might be a silly typo but it's easy to overlook and I'm quite surprised that it works perfectly fine in the dev server. I had a real head scratcher when I ran the production build and everything after the above would not render without any warnings.
I am trying to run npm run build on my scaffolding app buit I get this error:
ERROR in ./src/services/auth.js
Module not found: Error: a dependency to an entry point is not allowed
@ ./src/services/auth.js 15:12-30
I can't figure out what problem I have in auth.js file. Here is the code of auth.js:
import Config from '../config/config'
import LocalStorage from './ls'
import { router } from '../main'
export default {
user: {
authenticated: false
},
login (context, creds, redirect) {
context.$http.post(Config.api.base_url + '/login', creds).then((response) => {
LocalStorage.set('jwt-token', response.data.token)
this.user.authenticated = true
window.shared_state.authenticated = true
if (redirect) {
router.go(redirect)
}
}, (err) => {
context.error = err || true
})
},
signup (context, creds, redirect) {
context.$http.post(Config.api.base_url, creds).then((response) => {
LocalStorage.set('jwt-token', response.data.token)
this.user.authenticated = true
window.shared_state.authenticated = true
if (redirect) {
router.go(redirect)
}
}, (err) => {
context.error = err
})
},
logout () {
LocalStorage.remove('jwt-token')
this.user.authenticated = false
window.shared_state.authenticated = false
},
checkAuth () {
var jwt = LocalStorage.get('jwt-token')
if (jwt) {
this.user.authenticated = true
window.shared_state.authenticated = true
} else {
this.user.authenticated = false
window.shared_state.authenticated = false
}
},
getAuthHeader () {
return {
'Authorization': 'Bearer ' + localStorage.getItem('jwt-token')
}
}
}
Hello, i tried tree of the default templates (webpack, webpack-simple, browserify-simple) and non of had hot reloading working, the last one (browserify) didnt even render the index.html and was stuck with Cannot GET /, trying to get it to work the entire day with no avail.
<style lang='less'>
@default-color: #FF5722;
.progress-bar-container{
width: 100%;
height: .5em;
background-color: lighten(@default-color, 30%);
.progress-bar{
width: 0%;
height: 100%;
box-shadow: none;
}
background-color: lighten(@default-color, 30%);
}
</style>
<template lang="jade">
div.progress-bar-container
div.progress-bar.color-normal(:style='{ width: percentage + "%" }')
</template>
<script>
export default {
props: {
percentage: {
type: Number,
default: 0
}
}
}
</script>npm run dev:
ERROR in ./src/components/ProgressBar.vue
Module not found: Error: Cannot resolve module 'template-html-loader' in E:\Documents\_Project\vue-cui\src\components
@ ./src/components/ProgressBar.vue 8:19-172this worked:
<template>
<div class="progress-bar-container">
<div class="progress-bar color-normal" :style='{width: percentage + "%"}'>
</div>
</div>
</template>When prompted for the description the script seems to display both the description and author fields at the same time blocking input for the description.
Project description: (A Vue.js project) Author: (Nathaniel Blackburn <[email protected]>) this is a testThis results in the description ending up the author field.
This is my first time installing vue-cli, I received the following error when I ran npm run dev:
ERROR in ./~/css-loader?sourceMap!./~/vue-loader/lib/style-rewriter.js!./~/vue-loader/lib/selector.js?type=style&index=0!./src/App.vue
Module build failed: ReferenceError: Promise is not defined
at LazyResult.async (/home/mint/dev/node/my-project/node_modules/vue-loader/node_modules/postcss/lib/lazy-result.js:157:31)
at LazyResult.then (/home/mint/dev/node/my-project/node_modules/vue-loader/node_modules/postcss/lib/lazy-result.js:79:21)
at Object.module.exports (/home/mint/dev/node/my-project/node_modules/vue-loader/lib/style-rewriter.js:88:6)
@ ./~/vue-style-loader!./~/css-loader?sourceMap!./~/vue-loader/lib/style-rewriter.js!./~/vue-loader/lib/selector.js?type=style&index=0!./src/App.vue 4:14-199 13:2-17:4 14:20-205
This caused the demo application to fail.
Workaround
downground css-loader in package.json
"css-loader": "^0.18.0",
i write something like this:
<img :src='rtrImg(ava)'/>
rtrImg (sex) {
if (sex === '女') {
return '../img/girl.jpg'
} else {
return '../img/boy.jpg'
}
}
i cant get the img resource because img has turn to base64 code.
how can i get these source in method inside ?
or any other way to write?
目前看到所有的vue工具都是基于单页应用的模式构建，想问一下，能不能有一个多页项目的应用，目前在这块用vue和webpack，构建多页应用的的时候遇到了瓶颈，希望作者有好的方案和建议，不甚感激~
$ npm run dev
ficloud-vue@ dev D:\website\vuejs-project\ficloud-vue
webpack-dev-server --inline --hot --config build/webpack.dev.conf.js
http://0.0.0.0:8080/
webpack result is served from /static/
content is served from D:\website\vuejs-project\ficloud-vue
404s will fallback to /index.html
Hash: 14553b34cf6c239c3a13
Version: webpack 1.12.10
Time: 2198ms
Asset Size Chunks Chunk Names
app.js 636 kB 0 [emitted] app
chunk {0} app.js (app) 214 kB [rendered]
[0] multi app 52 bytes {0} [built] [1 error]
......
最后提示找不到这个module
ERROR in Cannot find module 'estraverse'
@ multi app
i use webpack
when i $mount a root vue instance. hot module reoad is not work
see example
<div id="app"></div>import Vue from 'vue'
import App from './App.vue'
var AppConstructor = Vue.extend(App)
var app = new AppConstructor
app.$mount('#app')now edit App.vue some words. browser seems not work
and i find this breakpoint
Within our company, we would like to fork some of the main templates and make changes to them, but we would like to host it in Bitbucket. Our use case is not so much building templates for everyone to use, but building templates for us to use internally that contains our api hooks, layouts etc. Is this something that may be supported?
when npm install ,there are some errors! seems from
npm ERR! git clone --template=C:\Users\yudonghan\AppData\Roaming\npm-cache\_git-remotes\_templates --mirror http://githu b.com/ianstormtaylor/to-camel-case C:\Users\yudonghan\AppData\Roaming\npm-cache\_git-remotes\git-http-github-com-ianstor mtaylor-to-camel-case-0-2-1-075cfbaf204dae5d923dd8439e3cfb10: fatal: unable to access 'http://github.com/ianstormtaylor/ to-camel-case/': Empty reply from server
what ever, no vue command:
windows powerShell
npm 3.3.12
node v5.1.0
git version 2.7.0.windows.1
when I use npm install -g vue-cli, there are some errors and a warning.
npm WARN deprecated [email protected]: This package was split into two simpler plugins: metalsmith-layouts and metalsmith-in-place
npm ERR! git -c core.longpaths=true clone --template=C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\_templates --mirror http://github.com/ianstormtaylor/to-camel-case C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\http-github-com-ianstormtaylor-to-camel-case-f206d7eb
npm ERR! git clone --template=C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\_templates --mirror http://github.com/ianstormtaylor/to-camel-case C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\http-github-com-ianstormtaylor-to-camel-case-f206d7eb: Cloning into bare repository 'C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\http-github-com-ianstormtaylor-to-camel-case-f206d7eb'...
npm ERR! git clone --template=C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\_templates --mirror http://github.com/ianstormtaylor/to-camel-case C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\http-github-com-ianstormtaylor-to-camel-case-f206d7eb: fatal: Unable to find remote helper for 'http'
npm ERR! Windows_NT 6.3.9600
npm ERR! argv "D:\\Program Files\\nodejs\\\\node.exe" "D:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install" "-g" "vue-cli"
npm ERR! node v0.12.2
npm ERR! npm v2.7.4
npm ERR! code 128
npm ERR! Command failed: git -c core.longpaths=true clone --template=C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\_templates --mirror http://github.com/ianstormtaylor/to-camel-case C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\http-github-com-ianstormtaylor-to-camel-case-f206d7eb
npm ERR! Cloning into bare repository 'C:\Users\admin\AppData\Roaming\npm-cache\_git-remotes\http-github-com-ianstormtaylor-to-camel-case-f206d7eb'...
npm ERR! fatal: Unable to find remote helper for 'http'
npm ERR!
npm ERR!
npm ERR! If you need help, you may report this error at:
npm ERR! <https://github.com/npm/npm/issues>
npm ERR! Please include the following file with any support request:
npm ERR! E:\GitWorkSpace\learn-vue\npm-debug.log
So, how to do with this situation?
The error msg is as follows:
npm ERR! git clone --template=/Users/Calvin/.npm/_git-remotes/_templates --mirror http://github.com/ianstormtaylor/to-camel-case /Users/Calvin/.npm/_git-remotes/http-github-com-ianstormtaylor-to-camel-case-7ca8a050: Cloning into bare repository '/Users/Calvin/.npm/_git-remotes/http-github-com-ianstormtaylor-to-camel-case-7ca8a050'...
npm ERR! git clone --template=/Users/Calvin/.npm/_git-remotes/_templates --mirror http://github.com/ianstormtaylor/to-camel-case /Users/Calvin/.npm/_git-remotes/http-github-com-ianstormtaylor-to-camel-case-7ca8a050: fatal: unable to access 'http://github.com/ianstormtaylor/to-camel-case/': The requested URL returned error: 500
npm WARN deprecated [email protected]: lodash@<3.0.0 is no longer maintained. Upgrade to lodash@^4.0.0
npm ERR! Darwin 15.0.0
npm ERR! argv "/Users/Calvin/.nvm/versions/node/v4.3.0/bin/node" "/Users/Calvin/.nvm/versions/node/v4.3.0/bin/npm" "install" "-g" "vue-cli"
npm ERR! node v4.3.0
npm ERR! npm v2.14.12
npm ERR! code 128
npm ERR! Command failed: git clone --template=/Users/Calvin/.npm/_git-remotes/_templates --mirror http://github.com/ianstormtaylor/to-camel-case /Users/Calvin/.npm/_git-remotes/http-github-com-ianstormtaylor-to-camel-case-7ca8a050
npm ERR! Cloning into bare repository '/Users/Calvin/.npm/_git-remotes/http-github-com-ianstormtaylor-to-camel-case-7ca8a050'...
npm ERR! fatal: unable to access 'http://github.com/ianstormtaylor/to-camel-case/': The requested URL returned error: 500
npm ERR!
npm ERR!
npm ERR! If you need help, you may report this error at:
npm ERR! <https://github.com/npm/npm/issues>
npm ERR! Please include the following file with any support request:
npm ERR! /Users/Calvin/npm-debug.log
I have upgraded git to v2.7.1 and node to v4.3.0LTS, but it still can't work.
I keep getting this error when running npm run dev, i'm using the browserify version
> [email protected] dev /Users/cor/Development/woording/woording-web
> watchify -vd -p browserify-hmr -e src/main.js -o dist/build.js & http-server -c 1 -a localhost
events.js:85
throw er; // Unhandled 'error' event
^
Error: listen EADDRINUSE
at exports._errnoException (util.js:746:11)
at Server._listen2 (net.js:1156:14)
at listen (net.js:1182:10)
at net.js:1280:9
at GetAddrInfoReqWrap.asyncCallback [as callback] (dns.js:81:16)
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:99:10)
npm ERR! Darwin 15.2.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "dev"
npm ERR! node v0.12.3
npm ERR! npm v3.3.12
npm ERR! code ELIFECYCLE
npm ERR! [email protected] dev: `watchify -vd -p browserify-hmr -e src/main.js -o dist/build.js & http-server -c 1 -a localhost`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script 'watchify -vd -p browserify-hmr -e src/main.js -o dist/build.js & http-server -c 1 -a localhost'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the woording-web package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! watchify -vd -p browserify-hmr -e src/main.js -o dist/build.js & http-server -c 1 -a localhost
npm ERR! You can get their info via:
npm ERR! npm owner ls woording-web
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /Users/cor/Development/woording/woording-web/npm-debug.log
I tried to add some component to entry, but got the output file including Vue source code.
entry: {
app: './src/main.js',
input: ['./src/components/Input.vue']
}
So I wonder if I did it the wrong way?
Hi! First of all good job on Vue.js! I've been using it in some pet projects recently and it's been a blast. Looking forward to using it in a more official capacity :-)
This might be partial ignorance speaking since I have not looked into it in detail, but I was just wondering why the yeoman generator was dropped in favor of the vue-cli? Especially since the vue-cli appears to be a Vue-flavored Yeoman (e.g., templates vs generators).
Thanks in advance!
Hello how to fix
http://0.0.0.0:8080/
webpack result is served from /
content is served from D:\projects\vue\vuex-tutorial
404s will fallback to /index.html
vue make:component TodoItemComponent
can create a component in the right place with the right boilerplate. This can also be applied to vuex, where a single command can generate multiple files.
I personally feel it'll be best if the boilerplates are defined in the template repos itself rather than in vue-cli but i'm filing the issue here.
React
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
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
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.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.