当时学习 Vue-Cli 的时候看的是 Vue-Cli2 的相关教程,当把 package.json 上传 github 的时候提醒有安全问题,于是准备使用最新版的 Vue-Cli ,我一直认为才更新到 Vue-Cli3,没想到都到Vue-Cli4了
可能有很多特性在 Vue-Cli3 时就有了,做个笔记记录一下
Vue-Cli4
文档推荐以下两种方式创建项目
vue create my-project
# OR
vue ui # 可视化操作
如果仍然需要使用vue init webpack
初始化项目的话,则需要安装cli-init
,但是拉取的仍然是Vue-Cli2.0
版本
npm install -g @vue/cli-init
Vue-Cli4
中使用npm run serve
运行开发模式,其配置为
"scripts": {"serve": "vue-cli-service serve","build": "vue-cli-service build"}
也可以使用vue ui
进行可视化操作
vue cli3、package.json
文件里的browserslist
字段 (或一个单独的.browserslistrc
文件),指定了项目的目标浏览器的范围。这个值会被@babel/preset-env
和Autoprefixer
用来确定需要转译的JavaScript
特性和需要添加的CSS
浏览器前缀。查阅 此处 了解如何指定浏览器范围
// route level code-splitting// this generates a separate chunk (about.[hash].js) for this route// which is lazy-loaded when the route is visited.https://cli.vuejs.org/zh/guide/html-and-static-assets.html#preload/* webpackChunkName: "about" */
vue-router
提供了一个About
组件示例,为此路由生成单独的块,访问路由时延迟加载,可参阅 Prefetch与Preload
Vue-Cli4
没有了配置webpack
的config
与build
目录,配置由vue.config.js
定义,vue.config.js
文件定义于根目录,相关配置信息参阅 Webpack配置
module.exports = {devServer: {proxy: {'/': {target: 'http://www.example.com',ws: true,changeOrigin: true,pathRewrite: {}}}}
}
版权声明:本站所有资料均为网友推荐收集整理而来,仅供学习和研究交流使用。
工作时间:8:00-18:00
客服电话
电子邮件
admin@qq.com
扫码二维码
获取最新动态