vue-cli2.0创建项目

811 阅读2分钟

vue-cli2.xx安装:

npm install -g vue-cli

查看vue-cli的版本

vue -V

vue-cli2.xx创建项目:

vue init webpack vue-2-test

Project name:项目名称

Project description:项目描述

Author:作者

Vue build:

有两种方式,第一种为standalone方式,第二种runtime-only为runtime方式。
    1.runtime 打包的是 /node_modules/vue/dist/vue.common.js
    2.standalone 打包的是 /node_modules/vue/dist/vue.js 
    
Vue2.0有两种Build的方式:
    the standalone build and the runtime-onlybuild(独立构建和运行时构建)
    独立构建包括编译和支持template选项,但也要依赖于浏览器的API,所以不能用于服务端渲染。
    运行时构建不包括模板编译,并且不支持template选项,只能使用render选项。

Install vue-router:安装vue路由

Use ESLint to lint your code:是否使用ESLint检测你的代码(是否启用eslint检测规则,个人选择no
ESLint 是用来检查我们写的 JavaScript代码是否满足指定规则的静态代码检查工具。
通过用 ESLint 来检查一些规则,我们可以统一代码风格规则,如:
    1.代码缩进用几个空格;
    2.是否用驼峰命名法来命名变量和函数名等。
    3.减少错误, 如:相等比较必须用 === ,变量在使用前必须被声明,在条件语句中不能使用赋值语句等。
    4.提高代码质量,如:函数最多有多少条件分支;最多有几个参数,代码块最多能嵌套多少层等。
    5.其他。如: 禁用 alert。这可以提高用户体验,因为 alert 框的外观不是那么好看,而且往往
    与网站的风格不搭,一般都会自定义 alert 框。

Set up unit tests:是否建立单元测试代码,个人选择no

Setup e2e tests with Nightwatch:e2e测试,个人选择no

Should we run npm install for you after the project has been created? (recommended):选择安装方式,一般我选择npm

创建项目成功,下面进入启动流程:

输入指令:

cd vue-2-test	
npm run dev

项目启动成功,打开网页查看http://localhost:8080

成功打开网址,看到上面的图片,就证明项目启动成功,接下来开始你的coding吧。