vue-cli-v4.x从零开始

从零开始

1. 安装

npm install @vue-cli -g

2. 初始化创建项目

vue create 项目名
//注意它会自动的创建对应的目录

3. 选择配置 按键盘的上下键选择 “Manually select features” 回车确定
   

4. 按空格键表示选择该插件，选择如图所示插件，并回车确定
   

5. 按照如图选择，回车安装
   

6. cd 项目名 ， npm run serve 运行项目
   

7. 看src下是主要编写代码的目录
   

8. 解析一下目录

• 首先是最外层

最为层目录	解释
node_module	各种依赖包，cli帮你做了很多事情，甚至挂载服务器
public	纯粹的静态文件，public里的资源，除了默认的都不会进行打包压缩
src	主要的编写代码的区域
.gitignore	上传远程仓库规定不上传的目录
babel.config.js	编译模板的一些配置
package	包名，插件标识
README.md	在远程仓库是会直接展示的

• 其次src

SRC	解释
assets	静态资源文件，cli会压缩打包
components	放一些自定义的组件
router	路由文件
store	状态管理
views	页面级别的路由组件
App.vue	vue文件，第二个根组件，便于分离
index.js	入口文件，项目真正在流浪器上执行的开始文件

目录拓展

SRC	解释
service	接口函数文件
utils	函数工具库文件
layouts	页面布局组件集合

附录

开发要高效简单 开发配置几乎是必须的，想要了脚手架配置请点这里
vue-cli-v4.x配置