vue cli 4.0.5 的使用

vue cli 4.0.5 的使用

如今的 vue 脚手架已经升级到4.0的版本了,前两日vue 刚发布了3.0版本,我看了一下cli 4 和cli 3 没什么区别,既然这样,就只总结一下vue cli 4 的项目搭建吧,回顾一下。javascript

1. 建立项目

对应的命令:css

npm   create  '项目名 '

2. 手动选择配置选项

这里咱们通常选择手动配置
这里通常咱们选择手动配置前端

3.选择须要的依赖

在这里插入图片描述

这里的话按住空格就是选择,全选的话就是按住a
? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection)
>( ) Babel //转码器,能够将ES6代码转为ES5代码,从而在现有环境执行。 
( ) TypeScript// TypeScript是一个JavaScript(后缀.js)的超集(后缀.ts)包含并扩展了 JavaScript 的语法,须要被编译输出为 JavaScript在浏览器运行
( ) Progressive Web App (PWA) Support// 渐进式Web应用程序
( ) Router // vue-router(vue路由)
( ) Vuex // vuex(vue的状态管理模式)
( ) CSS Pre-processors // CSS 预处理器(如:less、sass)
( ) Linter / Formatter // 代码风格检查和格式化(如:ESlint)
( ) Unit Testing // 单元测试(unit tests)
( ) E2E Testing // e2e(end to end) 测试

  

4. 选择是否使用history router模式

Vue-Router 利用了浏览器自身的hash 模式和 history 模式的特性来实现前端路由(经过调用浏览器提供的接口)。 我这里建议选n。这样打包出来丢到服务器上能够直接使用了,后期要用的话,也能够本身再开起来。 选yes的话须要服务器那边再进行设置。 Use history mode for router? (Requires proper server setup for index fallback in production) vue

在这里插入图片描述

5. 选择css 预处理器

在这里插入图片描述

6. 选择Eslint 代码验证规则

在这里插入图片描述

6.2 选择何时进行检测

在这里插入图片描述

7.选择单元测试

这个须要根据本身的状况而定
在这里插入图片描述java

8.选择如何存放配置

这个通常都是独立放置,这样后期能够更方便的更改。在这里插入图片描述vue-router

9.选择是否保存当前的配置

通常我是不保存的,由于根据项目的不一样,相应的配置也会不一样
在这里插入图片描述vuex

10. 等待建立项目中

在这里插入图片描述
在这里插入图片描述

11. 成功后就能够访问了

在这里插入图片描述
在这里插入图片描述

相关文章
相关标签/搜索