文章目录
vue-cli 命令
- vue-cli下载安装：
- 1.1 vue-cli2:
npm install vue-cli -g
- 1.2 vue-cli3/cli4:
npm install -g vue@cli
- 创建新项目
- 2.1 vue-cli2:
vue init webpack 2.0project
- 2.2 vue-cli3/cli4:
vue create 3.0project
或通过视图创建项目：vue ui
- 启动项目
- 3.1 vue-cli2:
npm run dev
- 3.2 vue-cli3/cli4:
npm run serve
项目结构
vue-cli3/cli4中移除了配置文件目录：config 和 build 文件夹。
同时移除了 static 静态文件夹，新增了 public 文件夹，将 index.html 移动到 public 中。
- vue-cli2
|-- build // 项目构建(webpack)相关代码 | |-- build.js // 生产环境构建代码 | |-- check-version.js // 检查node、npm等版本 | |-- utils.js // 构建工具相关 | |-- vue-loader.conf.js // webpack loader配置 | |-- webpack.base.conf.js // webpack基础配置 | |-- webpack.dev.conf.js // webpack开发环境配置,构建开发本地服务器 | |-- webpack.prod.conf.js // webpack生产环境配置 |-- config // 项目开发环境配置 | |-- dev.env.js // 开发环境变量 | |-- index.js // 项目一些配置变量 | |-- prod.env.js // 生产环境变量 |-- src // 源码目录 | |-- components // vue公共组件 | |-- router // vue的路由管理 | |-- App.vue // 页面入口文件 | |-- main.js // 程序入口文件，加载各种公共组件 |-- static // 静态文件，比如一些图片，json数据等 |-- .babelrc // ES6语法编译配置 |-- .editorconfig // 定义代码格式 |-- .gitignore // git上传需要忽略的文件格式 |-- .postcsssrc // postcss配置文件 |-- README.md // 项目说明 |-- index.html // 入口页面 |-- package.json // 项目基本信息,包依赖信息等
- vue cli3/cli4
|-- src // 源码目录 | |-- components // vue公共组件 | |-- router // vue的路由管理 | |-- App.vue // 页面入口文件 | |-- main.js // 程序入口文件，加载各种公共组件 |-- public // 静态文件，比如一些图片，json数据等 | |-- favicon.ico // 图标文件 | |-- index.html // 入口页面 |-- vue.config.js // 是一个可选的配置文件，包含了大部分的vue项目配置 |-- .babelrc // ES6语法编译配置 |-- .editorconfig // 定义代码格式 |-- .gitignore // git上传需要忽略的文件格式 |-- .postcsssrc // postcss配置文件 |-- README.md // 项目说明 |-- package.json // 项目基本信息,包依赖信息等
