新老版本vue-cli的安装及创建项目等方式的比较
vue-cli 3.0 正式版于2018年8月发布,截至到2020年08月05日版本已经更新到4.4.6。Vue CLI 的包名称由 vue-cli 改成了 @vue/cli,目前网上很多的Vue项目搭建教程由于没有说明使用的vue-cli的版本,不同的操作方式往往给新人造成很大的困扰。3.0+与2.*版本在搭建项目时到底有何不同呢?下面做一下简单的介绍,希望可以帮到有需要的朋友。
| vue-cli(旧版本) | @vue/cli(新版本-推荐) | |
| 安装环境 | Node.js (>=6.x, 8.x preferred) npm version 3+ and Git |
Node.js 8.9 或更高版本 (推荐 8.11.0+) |
| 安装 | npm install vue-cli -g | npm install -g @vue/cli 或者 yarn global add @vue/cli |
| 查看版本号 | vue -V | |
| 卸载 | npm uninstall vue-cli -g 或 yarn global remove vue-cli | npm uninstall @vue/cli -g |
| 创建vue项目 | vue init 两种常用的模板类型: webpack-simple webpack 如:vue init webpack my-project |
vue ui 通过图形化页面创建 vue create 通过命令行创建 |
| 启动vue项目 | npm run dev 或 npm start | npm run serve |
| 打包vue项目 | npm run build | |
如果你安装新版前已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。
vue ui 通过图形化页面创建vue项目是vue-cli 3.0+以后版本才有的功能!!!
欢迎转载,但必须给出原文链接,并保留此段声明,否则保留追究法律责任的权利。
新老版本vue-cli的安装及创建项目等方式的比较的更多相关文章
- vue cli 3.0快速创建项目
本地安装vue-cli 前置条件 更新npm到最新版本 命令行运行: npm install -g npmnpm就自动为我们更新到最新版本 淘宝npm镜像使用方法 npm config set reg ...
- vue学习:安装及创建项目
1.先安装npm 参考链接:https://www.cnblogs.com/Hao-Killer/p/7235398.html 查看npm版本:在终端输入:npm -v 2.在安装vue # 安装vu ...
- vue.js---利用vue cli脚手架工具+webpack创建项目遇到的坑
1.Eslint js代码规范报错 WARNING Compiled with 2 warnings 10:43:26 ✘ http://eslint.org/docs/rules/quotes St ...
- Vue CLI 介绍安装
https://cli.vuejs.org/zh/guide/ 介绍 警告 这份文档是对应 @vue/cli 3.x 版本的.老版本的 vue-cli 文档请移步这里. Vue CLI 是一个基于 V ...
- vue cli的安装与使用
一.简介 vue作为前端开发的热门工具,受到前端开发人员的喜爱.为了简化项目的构建,采用vue cli来简化开发. vue cli是一个全局安装的npm包,提供了终端使用的命令.vue create可 ...
- 05. flex元素水平垂直居中(三种position水平垂直居中和两种新老版本水平垂直居中)
flex元素水平垂直居中(三种position水平垂直居中和两种新老版本水平垂直居中) (1).position : <!DOCTYPE html> <html lang=" ...
- vue安装及创建项目的几种方式
原文地址:https://www.wjcms.net/archives/vue安装及创建项目的几种方式 VUE安装的方式 直接用 script标签 引入 对于制作原型或学习,你可以这样使用最新版本: ...
- vue-cli 3.0 安装和创建项目流程
使用前我们先了解下3.0较2.0有哪些区别 一.3.0 新加入了 TypeScript 以及 PWA 的支持二.部分命令发生了变化: 1.下载安装 npm install -g vue@cli 2. ...
- vue进阶:基于vue-cli创建项目(搭建手脚架)
vue-cli安装.创建项目 基于vue-cli创建的项目进行开发 使用vue-cli图形化界面搭建项目 插件与工具 一.vue-cli简介.安装.创建项目 Vue-cli是基于Vue.js进行快速开 ...
随机推荐
- python eval函数,将列表样式的字符串转化为列表
python eval函数,将列表样式的字符串转化为列表 >>> str_1 = '[1,2,3,4,5,6]'>>> type(str_1)<type 's ...
- java 面向对象(十):关键字:this
1.可以调用的结构:属性.方法:构造器2.this调用属性.方法:this理解为:当前对象 或 当前正在创建的对象 2.1 在类的方法中,我们可以使用"this.属性"或" ...
- Python函数02/函数的动态参数/函数的注释/名称空间/函数的嵌套/global以及nolocal的用法
Python函数02/函数的动态参数/函数的注释/名称空间/函数的嵌套/global以及nolocal的用法 目录 Python函数02/函数的动态参数/函数的注释/名称空间/函数的嵌套/global ...
- 集群多JVM分布式锁实现
基于数据库表乐观锁 (基本废弃) 要实现分布式锁,最简单的⽅方式可能就是直接创建⼀一张锁表,然后通过操作该表中的数据来实现了了. 当我们要锁住某个⽅法或资源时,我们就在该表中增加一条记录,想要释放锁的 ...
- bzoj1528[POI2005]sam-Toy Cars*&&bzoj1826[JSOI2010]缓存交换
bzoj1528[POI2005]sam-Toy Cars bzoj1826[JSOI2010]缓存交换 题意: Jasio有n个不同的玩具,它们都被放在了很高的架子上,地板上不会有超过k个玩具.当J ...
- bzoj2456mode
bzoj2456mode 题意: 给你一个n个数的数列,求出现次数超过n div 2的数(只有1个). 题解: 注意空间只有1M,显然不能开数组.用两个变量,一个存“当前数”,另一个存“当前数”的个数 ...
- IDEA 导入maven 项目,出现报错,不能运行之类的
选择pom.xml,右键选择 Add as Maven Project
- 设计模式:proxy模式
目的:为其他对象提供一种代理以控制对这个对象的访问 理解:尽管Decorator的实现部分与代理相似,但Decorator的目的不一样.Decorator为对象添加一个或多个功能,而代理则控制对对象的 ...
- 一款直击痛点的优秀http框架,让我超高效率完成了和第三方接口的对接
1.背景 因为业务关系,要和许多不同第三方公司进行对接.这些服务商都提供基于http的api.但是每家公司提供api具体细节差别很大.有的基于RESTFUL规范,有的基于传统的http规范:有的需要在 ...
- javascript 通信协议
简介 javascript 通信协议是一个伪协议[1], 用于指定 URL 为 JavaScript 代码 语法: javascript:someScript; someScript 是一个或多个使用 ...