vue-cli 3 VUE脚手架项目搭建(详解)
vue-cli 3 VUE脚手架注: vue cli3 需要node8.9或者以上版本vue-cli版本检查// 命令行vue -V// 查看当前版本npm uninstall -g vue-cli//卸载之前的npm install -g @vue/cli//安装最新的开始构建项目vue create ‘项目名’回车创建配置default 是默认配置Manually select feature
·
vue-cli 3 VUE脚手架
注: vue cli3 需要node8.9或者以上版本
vue-cli版本检查
// 命令行
vue -V // 查看当前版本
npm uninstall -g vue-cli //卸载之前的
npm install -g @vue/cli //安装最新的
开始构建项目
vue create ‘项目名’ 回车创建
配置
- default 是默认配置
- Manually select features 是自己手动选择
(上下箭头切换,回车确定)
手动配置:
需要什么自己选择(上下箭头切换 空格选中 ) - babel:转换es6语法的这个必须要
- typescript 看自己需不需要用
- router管理路由的也选上
- vuex状态管理就看自己需不需要用
- css pre样式预处理器这个也加上
- linter/Formatter统一代码风格
- 最后2个分别是单元测试和端对端测试。 示例选择了几个常用的 然后回车确认
路由使用历史模式吗?
路由模式分为Hash模式 History(历史)模式 Abstract模式 三种
hash模式最明显的特点就是url上会带有#号, History历史模式的url就跟正常的访问地址一样。
示例不使用历史模式,所以选的n
选择css预处理器 我选的less
选择语法检测工具 - ESLint with error prevention only(只检测错误)
- ESLint + Standard config 自带linter和自动代码纠正,没有配置,自动格式化代码,可在编码早起发现规范问题和低级错误
- ESLint + Prettier 能统团队的代码风格
示例选择 ESLint + Prettier
选择语法检查方式
- Lint on save (保存就检测)
- Lint and fex on commit ( 用户提交文件到git的时候检测 )
示例选择 Lint on save
babel,postcss,eslint配置文件存放位置 - in dedicated config files(在专用配置文件中,就是单独管理)
- in package.json(放在package.json里)
示例选择:in dedicated config files
保存为未来项目的预配置
安装成功
yarn run serve启动项目
更多推荐
已为社区贡献5条内容
所有评论(0)