使用vue开发项目的前期工作可以参考前面写的: Vue环境搭建及node安装过程整理
Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置,带来现代化的前端开发流程。
只需几分钟即可创建并启动一个带热重载、保存时静态检查以及可用于生产环境的构建配置的项目:
# 全局安装 vue-cli
$ npm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
$ vue init webpack test //输入命令 ? Project name (test) test
? Project name test
? Project description (A Vue.js project) 测试项目
? Project description 测试项目
? Author lxx1024
? Author lxx1024
? Vue build standalone
? Install vue-router? (Y/n) Y //安装路由
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) n //Eslint验证,很严谨,所以选择n
? Use ESLint to lint your code? No
? Setup unit tests with Karma + Mocha? (Y/n) Y
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? (Y/n) Y
? Setup e2e tests with Nightwatch? Yes vue-cli · Generated "test". To get started: cd test
npm install
npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack
# 安装依赖,走你
$ cd my-project //进入到项目的根目录--直接进入到该文件夹即可
$ npm install //安装依赖包
$ npm run dev //运行项目
下面是运行结果
> npm install > phantomjs-prebuilt@2.1. install C:\Users\\Desktop\test\node_modules\phantomjs-prebuilt
> node install.js PhantomJS not found on PATH
Downloading https://github.com/Medium/phantomjs/releases/download/v2.1.1/phantomjs-2.1.1-windows.zip
Saving to C:\Users\\AppData\Local\Temp\phantomjs\phantomjs-2.1.-windows.zip
Receiving... Error making request.
Error: connect ETIMEDOUT 54.231.81.168:
at Object.exports._errnoException (util.js::)
at exports._exceptionWithHostPort (util.js::)
at TCPConnectWrap.afterConnect [as oncomplete] (net.js::) Please report this full log at https://github.com/Medium/phantomjs
test@1.0. C:\Users\\Desktop\test
+-- autoprefixer@7.1.
| +-- browserslist@2.5.
| | `-- electron-to-chromium@1.3.
| +-- caniuse-lite@1.0.
| +-- normalize-range@0.1.
.................
.................
| +-- html-entities@1.2.
| +-- querystring@0.2.
| `-- strip-ansi@3.0.
| `-- ansi-regex@2.1.
`-- webpack-merge@4.1. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0. (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN karma-sinon-chai@1.3. requires a peer of sinon@^2.1. but none was installed.
npm ERR! Windows_NT 10.0.
npm ERR! argv "E:\\nodejs\\node.exe" "E:\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install"
npm ERR! node v6.11.4
npm ERR! npm v3.10.10
npm ERR! code ELIFECYCLE npm ERR! phantomjs-prebuilt@2.1. install: `node install.js`
npm ERR! Exit status
npm ERR!
npm ERR! Failed at the phantomjs-prebuilt@2.1. install script 'node install.js'.
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 phantomjs-prebuilt package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! node install.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs phantomjs-prebuilt
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls phantomjs-prebuilt
npm ERR! There is likely additional logging output above. npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\\Desktop\test\npm-debug.log
> npm run dev > node build/dev-server.js > Starting dev server...
DONE Compiled successfully in 15700ms23:: > Listening at http://localhost:8080