脚手架
脚手架帮我们帮我们把 webpack 等相关的配置都处理好,我们只需要基于脚手架快速构建一个项目即可(项目中一定包含webpack的相关配置)
vue脚手架 vue-cli
我们使用任何东西第一步都是安装
1.安装脚手架(一般安装在全局)
//=>用npm安装
$npm install @vue/cli -g
//=>用yarn安装
$yarn global add @vue/cli安装成功后,全局环境会生成 $vue 的可执行命令,我们可以基于 $vue –version 来查看版本号,看是否安装成功
2.创建工程化项目
$vue create [项目名称](要遵循npm包的名称规范:数字或者小写字母)

第一项是我之前创建保存的配置,如果是第一次创建就有第二项和第三项
default (babel,eslint) :选择默认配置项(后期自己安装需要的模块和进行配置)
Manually select features :手动选择配置项
如果选择默认这篇文章就没有意义了,我们选择手动选择配置项

这里选择脚手架里的webpack配置,空格键是选择,我选择了以上这些项,如果有需要自行添减
babel(babel-preset-vue-app):babel-preset-env最新的ECMAScript功能、转换Vue JSX转换generator和async/await等
Router :Vue官方的路由管理器
Vuex :Vue中实现公共状态管理的插件 (处理组件之间的信息通信)
Css Pre-processors :CSS 预处理器(SASS/LESS/Stylus)
Linter / Formatter :eslint 语法检测
Unit Testing :单元测试
E2E Testing :端到端测试

是否使用路由器的历史模式,选择Y;选择哪个CSS 预处理语言的配置规则,我用的是less根据自己需要选择

选择自动化代码格式化检测,我用的 vscode 选的 ESLint+Prettier

选择第一个可以保存配置方便下次使用

第一个选项是把配置信息放到一个单独的文件
第二项是放到package.json里
创建后的项目目录










