vue-cli3快速开始

node

安装,略。

webpack

  • 安装webpack

    • npm install webpack webpack-cli -g
  • 查看版本
    • webpack -v

vue-cli

  • 安装vue-cli

    • npm install vue-cli -g
  • 查看vue-cli版本
    • vue -V
  • vue-cli2.x升级vue-cli3
    • 卸载:npm uninstall vue-cli -g
    • 安装:npm install -g @vue/cli

创建

  • 初始化项目

    • vue create xxx
    • 使用默认选项(或按需选择)

运行

  • cd xxx
  • yarn serve

CLI简介

包括三部分:

  • CLI
  • CLI服务
  • CLI插件

目前最新版本3.4

  • https://github.com/vuejs/vue-cli

CLI

  • 三个主要命令

    • vue create
    • vue serve
    • vue ui

服务

  • 命令:vue-cli-service
  • https://cli.vuejs.org/zh/guide/cli-service.html#使用命令

选项

vue create里选项,官方叫CLI插件。

https://cli.vuejs.org/zh/guide/#cli-插件

安装详解

安装前准备

安装命令

查看版本

这里除了npm,还出现了yarn。yarn是什么?

官网

  • vue-cli3.x

  • vue-cli2.x
    • https://github.com/vuejs/vue-cli/tree/v2#vue-cli--
  • vue-cli3源码包含的东西
    • https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue

其他

升级Vue-CLI3

  • https://juejin.im/post/5c4a83e36fb9a049b13e91ba

一个模板

  • https://github.com/wangyupo/vue-vuex-router/tree/master/src

Vue-CLI3详解的更多相关文章

  1. 六. Vue CLI详解

    1. Vue CLI理解 1.1 什么是Vue CLI 如果你只是简单写几个Vue的Demo程序, 那么你不需要Vue CLI,如果你在开发大型项目那么你需要它, 并且必然需要使用Vue CLI. 使 ...

  2. Vue 路由详解

    Vue 路由详解 对于前端来说,其实浏览器配合超级连接就很好的实现了路由功能.但是对于单页面应用来说,浏览器和超级连接的跳转方式已经不能适用,所以各大框架纷纷给出了单页面应用的解决路由跳转的方案. V ...

  3. Vue 实例详解与生命周期

    Vue 实例详解与生命周期 Vue 的实例是 Vue 框架的入口,其实也就是前端的 ViewModel,它包含了页面中的业务逻辑处理.数据模型等,当然它也有自己的一系列的生命周期的事件钩子,辅助我们进 ...

  4. Vue.prototype详解

    参考地址:Vue.prototype详解 如果需要设置 全局变量,在main.js中,Vue实例化的代码里添加. 不想污染全局作用域.这种情况下,你可以通过在 原型 上定义它们使其在每个Vue实例中可 ...

  5. 05-Vue入门系列之Vue实例详解与生命周期

    Vue的实例是Vue框架的入口,其实也就是前端的ViewModel,它包含了页面中的业务逻辑处理.数据模型等,当然它也有自己的一系列的生命周期的事件钩子,辅助我们进行对整个Vue实例生成.编译.挂着. ...

  6. vue实例详解

    Vue实例的构造函数 每个 Vue.js 应用都是通过构造函数 Vue 创建一个 Vue 的根实例 启动的 虽然没有完全遵循 MVVM 模式, Vue 的设计无疑受到了它的启发.因此在文档中经常会使用 ...

  7. Vue入门系列(五)Vue实例详解与生命周期

    Vue官网: https://cn.vuejs.org/v2/guide/forms.html#基础用法 [入门系列] (一)  http://www.cnblogs.com/gdsblog/p/78 ...

  8. Vue实例详解与生命周期

    http://www.jianshu.com/p/b5858f1e6e76 Vue的实例是Vue框架的入口,其实也就是前端的ViewModel,它包含了页面中的业务逻辑处理.数据模型等,当然它也有自己 ...

  9. vue指令详解

    一.vue简绍 1. Vue.js是什么    Vue.js也称为Vue,读音/vju:/,类似view,错误读音v-u-e. 版本分为v1.0 和 v2.0 2.Vue.js的特点 1. 是一个构建 ...

  10. vue v-for详解

    1.Vue动态渲染列表------v-for用法详解: Html: <figure v-for="list in lists">     <div>     ...

随机推荐

  1. async & await 的前世今生(Updated)----代码demo

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  2. 读懂这些spring boot的核心注解,快速配置完成项目搭建

    在spring boot中,摒弃了spring以往项目中大量繁琐的配置,遵循约定大于配置的原则,通过自身默认配置,极大的降低了项目搭建的复杂度.同样在spring boot中,大量注解的使用,使得代码 ...

  3. mysqld与mysqld_safe的区别

    文章1: 直接运行mysqld程序来启动MySQL服务的方法很少见,mysqld_safe脚本会在启动MySQL服务器后继续监控其运行情况,并在其死机时重新启动它.用mysqld_safe脚本来启动M ...

  4. HDU 6155 Subsequence Count 线段树维护矩阵

    Subsequence Count Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 256000/256000 K (Java/Oth ...

  5. 【bzoj4240】有趣的家庭菜园

    只要统计每一个左右分别有多少比他高的去min,然后求和 #include<algorithm> #include<iostream> #include<cstdlib&g ...

  6. android支付

    这里不讲具体的某个平台的支付使用,在工作中,公司使用到了ping++支付,使用它的好处是可以不用关心某个平台的支付了,例如:微信支付.支付宝支付等,太多的平台有个整合,是一个很好的事情,当然这也减轻了 ...

  7. C语言文件读写Demo

    CIODemo.c #include <stdio.h> #include <time.h> #define INPUT_BUFFER_SIZE 100 * 1024 int ...

  8. 图像物体检測识别中的LBP特征

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/xinzhangyanxiang/article/details/37317863 图像物体检測识别中 ...

  9. install build tools 25.0.2 and sync the project

    install build tools 25.0.2 and sync the project in android studio bundle.gradle,将buildToolsVersion修改 ...

  10. Hive 自定义函数 UDF UDAF UDTF

    1.UDF:用户定义(普通)函数,只对单行数值产生作用: 继承UDF类,添加方法 evaluate() /** * @function 自定义UDF统计最小值 * @author John * */ ...