美文网首页
搭建vue-cli3 vue前端工程

搭建vue-cli3 vue前端工程

作者: 瞎瞎瞎的梦甜 | 来源:发表于2021-03-24 17:48 被阅读0次

1、安装脚手架:vue install @vue/cli -g

2、vue create XXX

babel: Babel 是一个 JavaScript 编译器 https://www.babeljs.cn/

typescript: https://www.tslang.cn/index.html

sass: https://www.sass.hk/

node-sass是自动编译实时的,dart-sass需要保存后才会生效

3、vue ui

快速打开编辑器 code .

运行依赖和开发依赖区别

devDenpendencies是开发依赖,也就是开发中所使用的的依赖,线上生产环境上并不需要他们。命令为 npminstall/i xxx -D/--save-dev

npm i -D vue-loader-v16

4、添加环境变量

https://cli.vuejs.org/zh/guide/mode-and-env.html#%E6%A8%A1%E5%BC%8F

vue-cli3总共提供了四中方式来指定环境变量:

1.在根目录添加.env文件,配置所有情况下都会用到的配置(不知道这个存在的意义,所有的都需要的也就不需要配置了吧)。

2.在根目录添加.env.local文件,配置所有情况下都会用到的配置,与.env的区别是只会在本地,该文件不会被git跟踪。

3.在根目录添加.env.[mode]文件,配置对应某个模式下的配置,比如:.env.development来配置开发环境的配置。

4.在根目录添加.env.[mode].local文件,配置对应某个模式下的配置,与.env.[mode]的区别也只是会在本地生效,该文件不会被git跟踪。

.env.development  必须以VUE_APP_开头

.env.staging

.env.production

"build--prod": "vue-cli-service build--mode production",

环境加载优先级

为一个特定模式准备的环境文件将会比一般的环境文件拥有更改的优先级。

同一个key: .env.[mode].local > .env.[mode] > .env

5、路由

6、权限校验

7、axios的封装

相关文章

网友评论

      本文标题:搭建vue-cli3 vue前端工程

      本文链接:https://www.haomeiwen.com/subject/iglccltx.html