一、什么 是脚手架工具vue-cli?

类似于工人手里面的脚手架一样,帮助工人搭架子用,同样的vue脚手架工具也是帮助我们更好更快速的开发代码的工具

二、vue-cli能做什么?

三、vue-cli安装

前提条件: Node.js (>=4.x, 6.x preferred), npm version 3(必须安装Node.js)

npm install -g vue-cli

(1)用法:

$ vue init <template-name> <project-name>

template-name是引用的模板名称,project-name自己的项目名称

(2)eg(exempli gratia例如):

vue init webpack my-projec

注意:webpack引用的模板名称, my-project项目名称
    所有官方项目模板都是在vuejs-templates组织中的仓库。 将新模板添加到组织后,就可以运行vue init <template-name> <project-name>来使用该模板。 可以运行vue list查看所有可用的官方模板。
(3)目前可用的模板:

webpack - 一个功能齐全的Webpack + vue-loader安装程序,带有热重载,linting,测试和css抽取。
webpack-simple - 简单的Webpack + vue-loader设置,用于快速原型设计。
browserify - 一个全功能的Browserify + vueify设置与热重载,linting和单元测试。
browserify-simple - 用于快速原型设计的简单的Browserify + vueify设置。
pwa - 基于webpack模板的vue-cli的PWA模板

(4)脚手架关键词解析

软件开发的脚手架的概念是从建筑学术语上引申而来。在建筑学上,脚手架指施工现场为工人操作并解决垂直和水平运输而搭设的各种支架。你见过大楼施工吧?在大楼外墙围的那圈支架就是其中一种脚手架。
    在软件开发上(当然也包括前端开发)的脚手架指的就是:有人帮你把这个开发过程中要用到的工具、环境都配置好了,你就可以方便地直接开始做开发,专注你的业务,而不用再花时间去配置这个开发环境,这个开发环境就是脚手架。
    比如vue.js就有个vue-cli脚手架,基于node.js的开发环境,作者帮你把开发环境大部分东西都配置好了,你把脚手架下载下来就可以直接开发了,不用再考虑搭建这些工具环境。

.

vue脚手架工具vue-cli的更多相关文章

  1. 【vue系列之一】使用vue脚手架工具搭建vue-webpack项目

    对于Vue.js来说,如果你想要快速开始,那么只需要在你的html中引入一个<script>标签,加上CDN的地址即可.但是,这并不算是一个完整的vue实际应用.在实际应用中,我们必须要一 ...

  2. 使用vue脚手架工具搭建vue-webpack项目

    对于Vue.js来说,如果你想要快速开始,那么只需要在你的html中引入一个<script>标签,加上CDN的地址即可.但是,这并不算是一个完整的vue实际应用.在实际应用中,我们必须要一 ...

  3. 三、vue脚手架工具vue-cli的使用

    1.vue-cli构建 vue-cli工具构建:https://blog.csdn.net/u013182762/article/details/53021374 npm的镜像替换成淘宝 2.项目运行 ...

  4. Vue脚手架工具vue-cli和调试组件vue-devtools

    https://github.com/vuejs/vue-cli npm install vue-cli -g vue init webpack my-project cd my-project // ...

  5. vue脚手架工具

    1.安装node.js 2.安装vue-cli npm install vue-cli -g vue -V(-V大写)查看版本信息 3.安装webpack 4.初始化项目 vue init webpa ...

  6. 安装vue脚手架和vue安装element-ui

    首先下载安装node.js,因为vue依赖node.js,然后用npm安装vue,步骤如下: 安装成功后安装element-UI,步骤如下: 完成后用npm run dev 运行项目.

  7. 【vue系列之一】使用vue-cli脚手架工具搭建vue-webpack项目

    最近更新了webpack配置详解,可移步vue-cli webpack详解 对于Vue.js来说,如果你想要快速开始,那么只需要在你的html中引入一个<script>标签,加上CDN的地 ...

  8. 搭建vue脚手架---vue-cli

    vue-cli作为一款mvvm框架语言(vue)的脚手架,集成了webpack环境及主要依赖,对于项目的搭建.打包.维护管理等都非常方便快捷.我们在开发项目时尤其需要这样一个快速构建项目的工具. 以下 ...

  9. vue脚手架一

    一准备: 在F:/xampp/htdocs/文件夹下检查: 1,node -v; 2,npm -v; 3,淘宝镜像(选装): npm install -g cnpm --registry= https ...

随机推荐

  1. 【转】Java 并发编程:核心理论

    并发编程是Java程序员最重要的技能之一,也是最难掌握的一种技能.它要求编程者对计算机最底层的运作原理有深刻的理解,同时要求编程者逻辑清晰.思维缜密,这样才能写出高效.安全.可靠的多线程并发程序.本系 ...

  2. Ubuntu TFTP 服务

    /******************************************************************** * Ubuntu TFTP 服务 * 说明: * 在Ubun ...

  3. zip压缩文件测试

    http://tech.it168.com/a2009/0604/583/000000583382_5.shtml ];                MessageBox.Show(string.F ...

  4. RDA GUI

    创建服务:“sysapp_table.h” / "dvb_guiobj_table.h" / "atv_guiobj_table.h" “服务”与“回调”   ...

  5. angular中transclude的理解

    今天被这个transclude搞糊涂了,弄了半天,才知道原来使用起来很简单.很烦恼为社么书中的对于这个的介绍这么晦涩难懂.直到看到了这篇文章,才让我弄清楚了. 一.transclude介绍 trans ...

  6. jQuery入坑指南

    前言 Ajax官方文档 爱jQuery jQuery插件库 jQuery中文api input 赋值和取值 记录一下: 在写一个input赋值,二话不说就直接利用了$('#xx').val()来进行取 ...

  7. Luogu P1073 最优贸易【最短路/建反图】 By cellur925

    题目传送门 这么经典的题目,还是看了lyd的题解....唉难过. 一句话题意:在一张点有全都的图上找一条从1到n的路径,存在两个点p,q(p<q),使val[q]-val[p]最大. 给出的图是 ...

  8. docker保存对容器的修改

    我有一个Ubuntu的镜像用命令docker run -i -t -v /home/zzq/app/:/mnt/software/ 0ef2e08ed3fa /bin/bash登录进去发现没vi编辑器 ...

  9. Latex新人教程

    1.LaTeX软件的安装和使用 方法A(自助):在MikTeX的官网下载免费的MikTeX编译包并安装.下载WinEdt(收费)或TexMaker(免费)等编辑界面软件并安装. 方法B(打包):在ct ...

  10. Navicat无法连接Oracle数据库问题处理一例

    需要通过Navicat连接Oracle数据库进行数据迁移,发现无法连接,报如下错误信息: 按照百度中的说明配置了正确的oci. 此时又报如下错误: 问题解决: 经测试发现与软件的版本有关系,本机的Or ...