1. 安装node.js, Node.js安装包及源码下载地址为:https://nodejs.org/en/download/。

这次node.js不是主角,默认已安装好了,通过npm –v查看node.js是否安装好以及安装的node.js版本

如果你安装的是旧版本的 npm,可以通过 npm 命令“npm install npm -g”来进行版本升级。

npm(node package manager)nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等);npm安装插件过程:从http://registry.npmjs.org下载对应的插件包,但是该网站服务器位于国外,所以经常下载缓慢或出现异常。

因为npm安装插件是从国外服务器下载,受网络影响大,可能出现异常,如果npm的服务器在中国就好了,在此我们要感谢万能的淘宝啊,因为我们乐于分享的淘宝团队干了这事。

所以我们可以使用淘宝定制的 cnpm(gzip 压缩支持) 命令行工具代替默认的 npm;

npm install -g cnpm --registry=https://registry.npm.taobao.org

这样就可以使用 cnpm 命令来安装模块了:cnpm install [name] 。

2. 安装vue-cil,因为是全局安装,所以只需要运行一次就可以了。安装成功后,以后不必再安装,安装命令如下:

npm install -g vue-cli

3. 用vue-cil构建项目

3.1 把当前目录定位到项目存放目录

3.2 新建一个自己的vue项目“饿了么sell”

3.3 项目构建成功后,按照上一步给出的提示命令,往下面一步步执行

(使用npm命令时,过程比较缓慢,可以使用cnpm来代替,使用方法将npm install换成cnpm install即可,我这里使用的是npm)

3.4 运行了npm run dev之后,会自动打开一个浏览器窗口,在地址栏中输入http://localhost:8080,即可看到创建的项目运行的效果:

此文章发在本人订阅号和博客上,转载请注明出处。

本人订阅号二维码

【VueJS】windows环境安装vue-cli及webpack并创建VueJS项目的更多相关文章

  1. Redis:在windows环境安装Redis

    Redis:在windows环境安装Redis 第一步: 下载windows版本的Redis:https://github.com/MSOpenTech/Redis. 第二步: 在命令行执行:D:\r ...

  2. PHP XAMPP windows环境安装扩展redis 致命错误: Class 'Redis' not found解决方法

    PHP XAMPP windows环境安装扩展redis 致命错误: Class 'Redis' not found解决方法 1.电脑需要先安装redis服务端环境,并在安装目录下打开客户端redis ...

  3. Windows环境安装tesseract-ocr 4.00并配置环境变量

    最近要做文字识别,不让直接用别人的接口,所以只能尝试去用开源的类库.tesseract-ocr是惠普公司开源的一个文字识别项目,通过它可以快速搭建图文识别系统,帮助我们开发出能识别图片的ocr系统.因 ...

  4. windows环境安装MySQL

    转:https://www.cnblogs.com/ayyl/p/5978418.html windows环境安装MySQL mySQL下载链接:MySQL Installer 5.7 :http:/ ...

  5. Windows环境安装MySQL数据库

    Windows环境安装MySQL数据库 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 最近在学习Java语言,开发环境在Windows操作系统上,因此需要在Windows上安装My ...

  6. 安装vue CLI后, 出现安装权限问题

    问题:安装vue CLI后,出现:npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules/usr/l ...

  7. MongoDB(二):在Windows环境安装MongoDB

    1. 在Windows环境安装 1.1 MongoDB下载 要在Windows上安装MongoDB,首先打开MongoDB官网:https://www.mongodb.com/download-cen ...

  8. Vue CLI 5 和 vite 创建 vue3.x 项目以及 Vue CLI 和 vite 的区别

    这几天进入 Vue CLI 官网,发现不能选择 Vue CLI 的版本,也就是说查不到 vue-cli 4 以下版本的文档. 如果此时电脑上安装了 Vue CLI,那么旧版安装的 vue 项目很可能会 ...

  9. 在使用vue+webpack模版创建的项目中使用font-awesome

    前言:最近使用vue+webpack进行一个小项目的开发,按照官方模版文档完成项目初始化后打算引入ont-awesome字体图标库进行使用,引入过程中遇到一些问题并解决,现记录如下. 一开始进展很顺利 ...

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

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

随机推荐

  1. 使用 DNSPOD API 实现域名动态解析

    0. 简单概述在家里放一个 NAS 服务器,但是宽带的 IP 地址经常改变,一般路由器自带的花生壳域名解析可以解决,如果路由器没有类似功能或者想使用自己的域名,可以尝试使用 DNSPOD API 来实 ...

  2. android自定义控件(六) 刷新

    三种得到LinearInflater的方法 a. LayoutInflater inflater = getLayoutInflater(); b. LayoutInflater localinfla ...

  3. 【Lintcode】003.Digit Counts

    题目: Count the number of k's between 0 and n. k can be 0 - 9. Example if n = 12, k = 1 in [0, 1, 2, 3 ...

  4. 自动拆装箱(int,Integer)

    包装类型Java语言是一个面向对象的语言,但是Java中的基本数据类型却是不面向对象的,这在实际使用时存在很多的不便,为了解决这个不足,在设计类时为每个基本数据类型设计了一个对应的类进行代表,这样八个 ...

  5. transition插件

    $("#box").transition({ opacity: 0.1, scale: 0.3 }); $("#box").transition({ opaci ...

  6. WCF知识点(应用WCF支持原生Socket访问, 原始字节流传输)

    最近在做区域医疗中PIX时, 需要让PIX Manager同时支持HL7的V2和V3版本.思路是利用WCF来同时支持V2版本的c/s架构式的消息协议和V3版本WebService的Soap协议.  实 ...

  7. Linq 查询多张表,关系表

    项目中遇到一个问题, 有4张表, 然后相互之间有3张关系表关联, 一共七张表. 想要从顶层表查询最底层表的记录,不能写7层嵌套. 用Linq实现特别简单,  表:User,Role,Module,Fu ...

  8. gitea (git服务器), 修改配置,更换IP地址

    使用的gitea项目管理git 服务器 (可以不用备份项目, 通过直接修改gitea配置, 直接使用) 步骤1 可以直接访问项目, 步骤2 ,如果已有项目IP地址固定为192.168.1.x, 新的I ...

  9. Windows WMIC命令使用详解2

    Windows WMIC命令使用详解(附实例) https://blog.csdn.net/aflyeaglenku/article/details/77878525 第一次执行WMIC命令时,Win ...

  10. Servlet拦截方式

    Servlet拦截方式 1.拦截固定后缀的url,比如设置为 *.do.*.action, 例如:/user/add.action 此方法最简单,不会导致静态资源(jpg,js,css)被拦截. 2. ...