vue-cli 3 和 vue-cli 2的区别[转]

Vue-cli3.0于8.11日正式发布，看了下评论，不是特别的乐观，说说我个人的意见，我是Vue的忠实粉，so....

大概三个月前超哥就已经得知3.0的消息，试着用了下，相比之下现在的3.0和测试时的区别：

modern mode。启用该模式会自动构建两个版本的 js 包，针对支持现代浏览器的原生 ES2015+ 包，和针对其他旧浏览器的包，生成的 HTML 会通过 <script type="module"> 和 <script nomodule> 进行自动降级，不需要任何特殊部署配置。原生 ES2015 包几乎不需要任何 polyfill 和编译，代码尺寸更小，现代浏览器 parse 和运行也更快。

然后直接正题，我把版本降回到的2.9，接下来直接使用3.0的安装命令:

3.0的安装：vue create 3.0project；

2.0的安装：vue init webpack(据我所知有五个，这个是我常用的) 2.0project(项目名)；

如果版本为>3.0npm 会提示，如果你想运行请升级到3.0，还等啥升级呗。

一路回车是完事了嘛？，猛的一看，哦NO，本人并不喜欢eslint，是特别反感的那种，相信很多朋友都不喜欢。

来回头看，他是问你是否使用默认的preset 还是手动配置功能，而我们却回车回车再回车，让我们从新来过，手动选择，只因eslint，强迫症又来了。

上图是手动的情形，如果选择手动则出现这个这个页面，可以使用空格键选中或取消，a选中所有，i反选，来让我们看看好像和2.0+没啥太大的的区别，简单的过目一下猛的一看多了VUEX？之前有vuex嘛？反正我是自己配的，其他的什么单元测试、路由...2.0+也都有。

接下来看看 2.0+的：

上图是2.0+的

确实VUEX是新加的。来启动一下3.0：

3.0启动npm run serve

2.0启动npm run dev

至于为什么会变，来看一下package.json

这就秒懂了吧！！！

接下来简单的看一下项目目录对比：

build没了、config没了、哦对了还有最重要的一点，3.0的安装项目时自动下载node-model。

如果vue.config.js没了怎么破。

慌鸡毛，超哥带你走向人生巅峰！！！

在根目录下创建一个vue.config.js不就行了，哈哈哈哈哈，我也觉着逗，具体配置看文档，写的很详细！！！

还是给你们写两个常用的吧，一群吃瓜群众。。。

module.exports = {baseUrl: process.env.NODE_ENV === 'production' ? '/online/' : '/',// outputDir: 在npm run build时 生成文件的目录 type:string, default:'dist'// outputDir: 'dist',// pages:{ type:Object,Default:undfind }devServer: {port: 8888, // 端口号host: 'localhost',https: false, // https:{type:Boolean}open: true, //配置自动启动浏览器// proxy: 'http://localhost:4000' // 配置跨域处理,只有一个代理proxy: {'/api': {target: '<url>',ws: true,changeOrigin: true},'/foo': {target: '<other_url>'}}, // 配置多个代理}
}

好了，终于完事了。

本文仅限于需要的人和自家人看，所以...不喜勿喷，布鞋！！！

原文地址

vue-cli 3 和 vue-cli 2的区别[转]相关推荐

VSCode 搭建Vue开发环境之Vue CLI
2019独角兽企业重金招聘Python工程师标准>>> 一.简介说明 1.关于VS Code开发工具,安装和配置,更多可以参考以前文章 2.关于Vue.js,Vue是一个优秀的渐进式 ...
七、Vue cli详解学习笔记——什么是Vue cli ,Vue cli的使用（安装，拉取2.x模板，初始化项目），Vue cli2详解，Runtime-Compiler和Runtime-only区别
一.什么是Vue CLI 如果你只是简单写几个Vue的Demo程序, 那么你不需要Vue CLI. 如果你在开发大型项目, 那么你需要, 并且必然需要使用Vue CLI 使用Vue.js开发大型应用时 ...
Vue学习笔记(九) Vue CLI
1.简介 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,它包括三个独立的部分: CLI:一个全局安装的 npm 包,提供在终端里使用的命令 CLI 服务:一个局部安装在使用了 @v ...
Vue学习笔记：使用CLI构建Vue项目
Vue学习笔记:使用CLI构建Vue项目一.安装Vue CLI 要用到集成在node.js里的npm来安装Vue CLI. 1.下载并安装node.js 2.配置node.js的环境变量 3.启动命 ...
【Cli下在vue.config.js配置configureWebpack/resolve/alias之无效 - 】
cli下在vue.config.js配置configureWebpack/resolve/alias无效 - DCloud问答
Vue CLI 3.x 与 2.x的区别
主要区别安装与项目构建项目目录变化项目配置变化安装&项目构建 CLI安装 cli的包名变更 # cli 2.x npm install -g vue-cli# cli 3.x # 3. ...
vue create is a Vue CLI 3 only command and you are using Vue CLI 2.9.6. You may want to run the
提示:vue create is a Vue CLI 3 only command and you are using Vue CLI 2.9.6. You may want to run the f ...
在 Quasar cli 搭建的 vue 项目中引用阿里字体图标 iconfont symbol方式
在 Quasar cli 搭建的 vue 项目中引用阿里字体图标 iconfont 1. symbol 方式 2. font class 方式(未实践) 1. symbol 方式首先说明一下,这 ...
vue create is a Vue CLI 3 only command and you are using Vue CLI 2.9.6. You
之前自己安装的vue版本是2.9.6的但是最近项目需要,cli的命令vue create无法使用,报错 vue create is a Vue CLI 3 only command and you a ...
Vue2.x 核心基础（Vue概述，Vue基本使用，@vue/cli脚手架，Element-UI 的基本使用，Vue模板语法）
1. Vue概述尤雨溪:Vue.js的创建者 2014年2月,Vue.js正式发布 2015年10月27日,正式发布1.0.0 2016年4月27日,发布2.0的预览版本 Vue:渐进式JavaSc ...

vue-cli 3 和 vue-cli 2的区别[转]

vue-cli 3 和 vue-cli 2的区别[转]相关推荐

最新文章

热门文章