Vue基础：一、开发环境

开发环境

npm install --global vue-cli
npm install -g webpack
npm install -g cnpm --registry=http://registry.npm.taobao.org
cnpm i node-sass -D
cnpm i sass-loader -D
cnpm i axios -D
cnpm i element-ui -D
cnpm i babel-polyfill -D
cnpm i es6-promise -D

初始化

vue init

配置

？Project name ---- 项目名称，init命令时也填了个project-name，如果无需更改，直接回车即可；

？Project description ---- 项目描述，按需填写。无需填写可以直接回车；

？Author ---- 作者

？Vue build ---- 构建模式，一般默认第一个；

？Install vue-router? ---- 是否安装vue-router。选Y。后边构建项目会用到。

？Use ESLint to lint yout code? ---- 格式校验，按需（不需要，使用idea即可）；

？Set up unit tests ---- 测试相关，按需；

？Setup e2e tests with Nightwatch? ---- 测试相关，按需；

？Should we run ‘npm install’ for you after the project has been created? ---- 按需，如果选No，后续自己在目标目录下执行npm install即可。

运行

npm install
npm run dev
使用 live-server 开发时，页面可以实时更新

目录结构

build：项目构建(webpack)相关代码
config：配置目录，包括端口号等
node_modules：npm加载的项目依赖块
src：这里是我们要开发的目录，基本上要做的事情都在这个目录里。里面包含了几个目录及文件：
assets: 放置一些图片，如logo等。不编译
components：该目录里存放的我们的开发文件组件，主要的开发文件都存放在这里了
App.vue：项目入口文件
main.js：项目的核心文件
router：路由配置目录
static：放置一些静态资源文件
test：初始测试目录，可删除
.xxxx文件：这些是一些配置文件，包括语法配置，git配置等
index.html：首页入口文件
package.json：项目配置文件
README.md：项目的说明文档，markdown 格式