一、安装

1、先检查是否有安装vue  (vue-cli3需要node大于等于8.9版本)

  //vue -V

2、如果没安装跳过、安装有3.0以下的版本就的先卸载掉以前的版本

  npm uninstall vue-cli -g  //或者yarn global remove vue-cli

3、卸载好后、接着开始安装新版本cli

  npm install -g @vue/cli  //yern global add @vue/cli

二、使用

  1、vue create(项目名)开始新建项目

    

  2、接着你会看到一个预设

  

  除了最后两个、其它都是以前保存过的

  (1)default(babel,eslint)能够快速构建一个项目、没附带人格辅助功能npm包

  (2)Manually select features 自定义依赖npm包

  3、接下来会看到这个样子的如下图、选着一些依赖等(空格选择)

  

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

  

4、接下来会问你是否使用history router

  

5、后面紧接着会提示使用css预编、代码测试、何时测试、单元测试等。选择完后会问你是否保存本次选择的、然后给本次保存起个名字

最后安装完 npm run serve 启动项目

vue脚手架3.0的安装与使用的更多相关文章

  1. Vue脚手架(vue-cli)安装总结

    单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序. 提供一 ...

  2. vue脚手架3.0的搭建

    一.安装node 打开cmd输入node -v查看是否安装成功 显示node版本号表示安装成功,显示‘node’不是内部或外部命令表示未安装node.node安装地址:http://nodejs.cn ...

  3. React/VUE 脚手架2.0和3.0

    react官方脚手架 npm install -g create-react-app create-react-app my-app cd my-app npm start 区别自己对比 vue2.x ...

  4. vue-cli3.0 vue脚手架3.0的使用

    1.安装vue-cli 3.0 npm install -g @vue/cli # or yarn globaladd @vue/cli 安装成功后查看版本:vue -V(大写的V)     2.命令 ...

  5. vue.js 2.0 --- 安装node环境,webpack和脚手架(入门篇)

    1.环境搭建 1.1.安装node.js 1.2 安装过程很简单,一路“下一步”就可以了.安装完成之后,打开命令行工具(win+r,然后输入cmd),输入 node -v,如下图,如果出现相应的版本号 ...

  6. Mac OS X下安装Vue脚手架(vue-cli)

    前言 Vue作为前端三大框架(Angular,React,Vue)之一,号称是最简单,最容易上手的框架,同时也是行内的大趋势,还可以用来开发最火的小程序.具有开发快,双向数据流等特点,有些人认为Vue ...

  7. npm安装使用及vue脚手架安装

    公司在前端用vue开发项目,那就学习下啦,第一步,在安装vue-devtools过程中,npm作为官方manual installtion方式,肯定必不可少. NPM是随同NodeJS一起安装的包管理 ...

  8. vue/cli 3.0脚手架搭建

    在vue 2.9.6中,搭建vue-cli脚手架的流程是这样的: 首先 全局安装vue-cli,在cmd中输入命令: npm install --global vue-cli  安装成功:  安装完成 ...

  9. Vue2.0史上最全入坑教程(上)—— 搭建Vue脚手架(vue-cli)

    ps: 想了解更多vue相关知识请点击VUE学习目录汇总 Vue作为前端三大框架之一截至到目前在github上以收获44,873颗星,足以说明其以悄然成为主流.16年10月Vue发布了2.x版本,经过 ...

随机推荐

  1. 在线教育项目-day05【课程分类管理-添加课程分类】

    1.引入依赖 之前测试EasyExcel已经引入过了 2.利用代码生成器生成结构 我们做的只需要更改代码生成器的数据库表即可 3.运行代码生成器 4.书写代码 1.controller @RestCo ...

  2. 详解Linux 安装 JDK、Tomcat 和 MySQL(图文并茂)

    https://www.jb51.net/article/120984.htm

  3. 长江存储推全新3D NAND架构 挑战三星存储

    雷帝网 乐天 8月7日报道 作为NAND行业的新晋者,长江存储科技有限责任公司(简称:长江存储)今天公开发布其突破性技术--XtackingTM.据知情人士透露,这之前存储一直都是三星的强项. 长江存 ...

  4. 01-复杂度2 Maximum Subsequence Sum

    01-复杂度2 Maximum Subsequence Sum   (25分) 时间限制:200ms 内存限制:64MB 代码长度限制:16kB 判题程序:系统默认 作者:陈越 单位:浙江大学 htt ...

  5. JSP、ASP、PHP Web应用程序怎么这么多P!

    之前我们说完了计算机网络应用程序的两种结构:C/S,B/S(传送门)今天我们详细说一说B/S开发中的这么多P是干什么的. 1.什么是Web应用程序 一个Web应用程序是由完成特定任务的各种Web组件( ...

  6. 虚拟 IP 设为静态 IP

    一:虚拟机设置桥接模式 1.进入虚拟机设置中将网络适配器设置成桥接模式 2.编辑--虚拟网络编辑器--选择桥接 二:将虚拟IP设置成静态IP (1)方案一:进入虚拟机系统 System 设置 (2)方 ...

  7. shell之路 Linux核心命令【第一篇】管道符与重定向

    输出重定向 命令输出重定向的语法为: command > file 或 command >> file 这样,输出到显示器的内容就可以被重定向到文件.果不希望文件内容被覆盖,可以使用 ...

  8. vue获取当前时间 实时刷新

    需求:获取当前系统时间,在页面上展示 年月日 时分秒 ,并且实时刷新,和系统时间保持一致 第一步:在deta 里面声明两个变量第二步:把时间调用写在created() 生命周期里面,进入页面就需要调用 ...

  9. ZABBIX自动发现Redis端口并监控

    由于一台服务器开启许多Redis实例,如果一台一台的监控太耗费时间,也非常容器出错.这种费力不讨好的事情我们是坚决杜绝的,幸好ZABBIX有自动发现功能,今天我们就来用该功能来监控我们的Redis实例 ...

  10. JVM之类加载器、加载过程及双亲委派机制

    JVM 的生命周期 虚拟机的启动 Java 虚拟机的启动是通过引导类加载器(bootstrap class loader)创建一个初始类(initial class)来完成的,这个类是由虚拟机的具体实 ...