第一步,需要下载并安装node.js以及他的npm组件;

  第二步,用node -v;npm -v来测试node.js以及npm是否安装成功(建议用GIT命令行工具,因为GIT是linux系统),如果显示出它的版本,说明已经安装成功,如下图;

  

  第三步,下载vue-cli,在命令行中输入npm install -g vue-cli,自动下载vue-cli(会生成一大堆的依赖文件)如下图;

  

  第四步,命令行中输入vue,测试vue是否安装成功,安装成功,如下图;

  

  第五步,命令行vue list看vue中有哪些子类,如下图;

  

  第六步,用vue init webpack ***命令行,下载webpack包,(***代表项目的名字,为英文,如sanfeng1)如下图;

  

    在安装时会询问你,①、Project name (sanfeng1);项目名称(sanfeng1)。(确定按enter,否按N)

             ②、 Project description (A Vue.js project);项目描述(一vue.js项目)。(随意输入一段简短介绍,用英文)

             ③、Author (sunsanfeng);作者(sunsanfeng)。(确定按enter,否按N)

             ④、Vue build (Use arrow keys)> Runtime + Compiler: recommended for most usersRuntime-only: about 6KB lighter min+gzip, but templates (or any Vue-specificHTML) are ONLY allowed in .vue files - render         functions are required elsewhere;Vue公司的建立(使用箭头键)>运行时+编译器:大多数用户推荐运行时间:约6kb轻民+ gzip,但模板(或任何Vue具体HTML)只允许在。VUE文件渲染功能是必需的其他地方。(按enter)

             ⑤、Install vue-router? (Y/n);安装的路由?(/ N)。(可安可不安,以后也可以再安,根据需求选择)

            ⑥、Use ESLint to lint your code? (Y/n);使用ESlint语法?(Y/ N)。(使用ESLint语法,就要做好心理准备,除非你非常懂ESLint语法,要不就会处处报错,我就被逼疯过,建议N)

            ⑦、Setup unit tests with Karma + Mocha? (Y/n);设置单元测试?(Y / N)。(选N)

            ⑧、Setup e2e tests with Nightwatch? (Y/n);Nightwatch建立端到端的测试?(Y / N)。(选N)

      出现如下图,说明已经安装成功;

      

  默认情况下,webpack安装的是最新版本的,如果要安装其他版本,使用命令行vue init webpack#1.0 ***就可以了。

  第七步,进入我们刚才创建的项目,cd sanfeng1,并安装依赖npm install,安装成功,如下图;

  

  第八步,运行这个项目 npm run dev运行成功,如下图;

  

  在浏览器打开地址以及端口号,就可以看见我们的项目了。

  

  

vue-cli webpack在node环境下安装使用的更多相关文章

  1. node环境下安装vue-cli

    一. node安装 1)如果不确定自己是否安装了node,可以在命令行工具内执行: node -v  (检查一下 版本): 2)如果 执行结果显示: xx 不是内部命令,说明你还没有安装node , ...

  2. linux环境下安装sphinx中文支持分词搜索(coreseek+mmseg)

     linux环境下安装sphinx中文支持分词搜索(coreseek+mmseg) 2013-11-10 16:51:14 分类: 系统运维 为什么要写这篇文章? 答:通过常规的三大步(./confi ...

  3. 在Hadoop1.2.1分布式集群环境下安装hive0.12

    在Hadoop1.2.1分布式集群环境下安装hive0.12 ● 前言: 1. 大家最好通读一遍过后,在理解的基础上再按照步骤搭建. 2. 之前写过两篇<<在VMware下安装Ubuntu ...

  4. 在windos 环境下安装

    在windows 环境下安装node 和 StrongLoop需要一些几个步骤. 本人使用的安装软件,文章最后的分享. 1,安装Git: 2,安装Node.js: 3,安装npm: 4,安装Stron ...

  5. Linux环境下安装NodeJS和mongoDB

    前面的话 本文将详细介绍如何下Linux环境下安装NodeJS和mongoDB NodeJS [1]使用二进制包安装 1.在官网下载Linux环境下的NodeJS安装包 2.通过xftp软件将安装包上 ...

  6. Elasticsearch Docker环境下安装

    Elasticsearch Docker环境下安装 Daemon镜像配置的是https://registry.docker-cn.com Linux:vi /etc/docker/daemon.jso ...

  7. node环境下:node_modules里面的文件

    node环境下:node_modules里面的文件 package.json来制定名单,需要哪些npm包来参与到项目中来,npm install命令根据这个配置文件增减来管理本地的安装包. depen ...

  8. YApi——手摸手,带你在Win10环境下安装YApi可视化接口管理平台

    手摸手,带你在Win10环境下安装YApi可视化接口管理平台 YApi YApi 是高效.易用.功能强大的 api 管理平台,旨在为开发.产品.测试人员提供更优雅的接口管理服务.可以帮助开发者轻松创建 ...

  9. 【转】windows环境下安装win8.1+Mac OS X 10.10双系统教程

    先要感谢远景论坛里的各位大神们的帖子  没有他们的分享我也不能顺利的装上Mac OS X 10.10! 写这篇随笔主要是为了防止自己遗忘,同时给大家分享下我的经验. 本教程适用于BIOS+MBR分区的 ...

随机推荐

  1. list、set、map区别

    list是有序且重复的; list中的数据都是按照写入的顺序排列的,存入list的数据用add方法写入; list可以用循环遍历list以达到获取全部数据的目的,同时也可以通过下标get(index) ...

  2. 好久没发贴了,最近捣鼓了个基于node的图片压缩小网站解析。

    看了下,距离上次发帖都是去年10月份的事,忙于工作的我很少跑博客园里面来玩了. 做这个小网站的初衷是 https://tinypng.com/ 这个网站有时候访问很慢,然后自己去研究了下图片压缩. 网 ...

  3. Python-3------新年考试周的Python学习

    2016一开始就是考试周,准备专业课的考试复习.每天上午复习,晚上复习到8点半,之后到10点这点时间来看Python.庆幸没有在忙碌的时候荒废 Python的学习. 期待寒假,以前寒假在家总是没事做, ...

  4. 【整理】hash算法原理及常见函数

    简介 Hash,一般翻译做"散列",也有直接音译为"哈希"的,就是把任意长度的输入,通过散列算法,变换成固定长度的输出,该输出就是散列值.        散列表 ...

  5. php中print_r、var_dump和var_export几个函数的用法区别

    php中print_r.var_dump和var_export几个函数的用法区别

  6. Java基础语法(一)<注释,关键字,常量,变量,数据类型,标识符,数据类型转换>

    从今天开始,记录学习Java的过程.要学习Java首先得有环境,至于环境的安装我就不说了,百度有很多教程,比如:http://jingyan.baidu.com/article/20095761904 ...

  7. <java>枚举的简单介绍

    1.枚举,enum关键字,相当于public final static. 2.举例: 首先定义了一个名为spiciness的枚举类型. public enum Spiciness { NOT, MIL ...

  8. 自动化运维:使用psutil和paramiko读取远程主机信息

    1.前言  今天大致看了下自动化运维的东西,里面介绍到了psutil模块,其封装了linux 下的大部分shell命令,用起来比较方便.但是基本都是介绍在本地如何使用,而实际情况大家很少这样使用,一般 ...

  9. 记录——excel导出lua工具(python实现)

    项目需要一个从excel导出lua配置表的工具,之前的工具是主程写的,效率极差,i7 CPU 一次全部导出要花掉1个多小时.匪夷所思的是,这么渣的效率,居然用了整整一年.当 然,中途有人反映效率差,主 ...

  10. OC中Foundation框架之NSString、NSMutableString

    创建方式 )直接赋值 NSString *str =@"abc"; )创建对象 NSString *str2 = [[NSString alloc]init]; str2 =@&q ...