https://github.com/vuejs/vue-cli 官网 使用官方推荐的webpack

条件:
node在4.以上,npm在3以上,查看版本号打开cmd输入,node -v     npm -v;

安装步骤:
1、cmd打开命令行窗口
2、输入npm install vue-cli -g,然后回车等待

3、安装结束后输入vue 查看是否安装成功


4、运行vue init webpack demo(注:项目名称)回车,(想在哪个目录建立vue项目就要在进入到对应目录再输入命令)


5、显示Project nanme 项目名 回车(项目名不允许使用大写)

6、project description 后面可以写上描述,或者直接回车


7、Author 后面可以写作者也可以回车 (如果配置过git会自动获取git的name)


8、Install vue-router? 选择Y(官方推荐的路由插件,几乎每个项目都用得到)


9、User ESLint to lint your code? 选Y(是否启用eslint检测规则,如果不是公司的大型项目或者多人共同开发博主感觉没有必要安装)


10、Set up unit tests? 问的是否要测试 选n

11、Setup e2e tests with Nightwatch? 选n( 用Nightwatch设置E2E测试?)

12、Should we run `npm install` for you after the project has been created? (recommended) (Use arrow keys) 选择使用npm、还是yarn安装,一般都是直接回车就好

13、这个时候在你创建的目录下就有你的目录了

14、cd 你的目录名然后输入npm run dev启动应用,启动成功它会自动打开一个vue页面


到此为止你已经学会了怎么安装 vue-cli脚手架工具了,下面我简单的说明下各个目录都是干嘛的:

main.js的介绍
el是挂载点,router是路由

App.vue 是整个文件的入口,有三部分,template模板 script 逻辑 style样式

注:网络整合如有侵权请联系博主删除

vue-cli脚手架的安装的更多相关文章

  1. node.js和vue cli脚手架下载安装配置方法

    一.node.js安装以及环境配置 1.下载vue.js 下载地址: https://nodejs.org/en/ 2.安装node.js 下载完成后,双击安装包开始安装.安装地址最好换成自己指定的地 ...

  2. 【Vue CLI】从安装到构建项目再到目录结构的说明

    目录 1. 构建我们的项目 2. 目录结构说明 2.1 build目录 2.2 config目录 2.3 src目录 2.4 static目录 "Vue CLI是一个基于Vue.js进行快速 ...

  3. 13. Vue CLI脚手架

    一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...

  4. vue工具 - vue/cli@3.xx 安装使用流程

    mac安装记得npm前边加sudo 安装脚手架,用于生成目录 npm install -g @vue/cli 安装用于编译单个的.vue文件 npm install -g @vue/cli-servi ...

  5. 使用Vue CLI脚手架搭建vue项目

    本次是使用@vue/cli 3.11.0版本搭建的vue项目 1. 首先确保自己的电脑上的Node.js的版本是8.9版本或者以上 2. 全局安装vue/cli npm install @vue/cl ...

  6. vue.cli脚手架初次使用图文教程

    vue-cli作用 vue-cli作为vue的脚手架,可以帮助我们在实际开发中自动生成vue.js的模板工程. vue-cli使用 !!前提:需要vue和webpack 安装全局vue-cli npm ...

  7. VUE CLI 3.0 安装及创建项目

    一.安装 VUE CLI 3.0 官网: https://cli.vuejs.org/   详细资料可以自己先把官网过一遍. 1. 安装(默认你的电脑上已安装node及npm) npm install ...

  8. vue cli脚手架使用

    1.安装nodejs,npm https://www.cnblogs.com/xidianzxm/p/12036880.html 2.安装vue cli sudo npm install -g @vu ...

  9. windows系统下 VUE cli手脚架环境安装

    1.安装 node.js环境  (cmd命令工具里输入 node -v 检测是否安装成功) 2.安装VUE 全局环境 npm install --global vue-cli (cmd命令工具里面安装 ...

  10. 用 vue cli 脚手架搭建单页面 Vue 应用(进阶2)

    1.配置 Node 环境. 自行百度吧. 安装好了之后,打开 cmd .运行 node -v .显示版本号,就是安装成功了. 注:不要安装8.0.0以上的版本,和 vue-cli 不兼容. 我使用的 ...

随机推荐

  1. linux parallel rsync 拷贝N多文件

    先来个对比图看一下, 左边图是普通 rsync 目录拷贝, 右边图是借助 parallel 工具并发起了多个 rsync centos6.5安装 parallel #!/bin/bash # Inst ...

  2. Flask从入门到精通之flask安装

    使用虚拟环境 安装Flask最简单的方式是使用虚拟环境,虚拟环境是python解释器的一个私有副本,在这个环境中你可以安装私有包,而且不会影响系统中安装的全局的Python解释器.虚拟环境非常有用,可 ...

  3. Elasticsearch批量操作API用法介绍

    Elasticsearch的Bulk API允许批量提交index和delete请求,有如下两种用法: 用法1 BulkRequestBuilder requestBuilder = client.p ...

  4. js处理url中的请求参数(编码/解码)

    在处理 a 链接跳转其他页面时,总会遇到需要传递一些当前页面的信息到其他页面,然后其他页面利用这些信息进行相关操作.利用 get 请求或 hash 传递是常见的方式. 首先,需要对传递的参数进行编码, ...

  5. 部署虚拟环境安装Linux系统

      目录                                                              准备工作 安装linux系统 重置root管理员密码 源代码编译 R ...

  6. 【GDKOI2017】小队任务 莫比乌斯反演+杜教筛

    题目大意:给你n,求$\sum_{i=1}^{n}\sum_{j=i}^{n}[gcd(i,j)=1](i+1)(j+1)$ 子任务一:暴力 子任务二:$T=50000,n≤10^7$ 子任务三:$T ...

  7. 希尔排序的理解和实现(Java)

    希尔排序原理 希尔排序(shell sort)这个排序方法又称为缩小增量排序,是1959年D·L·Shell提出来的. 该方法的基本思想是:设待排序元素序列有n个元素,首先取一个整数increment ...

  8. easyUI datebox 日期空间斜杠格式化。例如将日期空间中显示2017-03-13,改为2017/03/13

    easyUI datebox 日期空间斜杠格式化 将日期空间中显示2017-03-13,改为2017/03/13 //日期控件斜杠格式化 function formatDate(date){ if( ...

  9. Java之集合(十一)IdentityHashMap

    转载请注明源出处:http://www.cnblogs.com/lighten/p/7381905.html 1.前言 查看JDK源码总是能发现一些新东西,IdentityHashMap也是Map的一 ...

  10. 泛型深入--java泛型的继承和实现、泛型擦除

    泛型实现类: package generic; /** * 泛型父类:子类为“富二代”:子类的泛型要比父类多 * 1,保留父类的泛型-->子类为泛型类 * 2,不保留父类泛型-->子类按需 ...