下载node(http://nodejs.cn/download/),安装时直接下一步,安装路径不要有汉字和空格
查看node和npm是否安装成功,检查版本:
node -v
npm -v

安装淘宝的cnpm镜像,替代默认的npm:
 npm install -g cnpm --registry=https://registry.npm.taobao.org

安装Vue脚手架:
cnpm install vue-cli -g(意思是cnpm安装vue-cli,在全局)

安装webpack-cli:
cnpm install webpack-cli -g

Linux/Mac执行-g全局安装,需要在命令前添加sudo,表示已管理员身份运行。

使用vue-cli初始化一个项目:
vue init webpack 项目名

项目名可以不加,不写的话,就是在当前位置创建项目。

启动运行命令:
cnpm run dev

停止运行命令:
ctrl+c
 
ctrl+单击路径在浏览器打开
 

根据package.json(类似pom.xml)中的依赖信息。
安装依赖组件:
cnpm install

运行当前项目:
cnpm run dev

vue init 初始化项目
cnpm install 安装组件
cnpm run 运行

 
 

1. 手动新建项目文件夹。
2. 拽到VSCode中(或者右键该文件夹,选择以VSCode打开)
3. Ctrl + `,打开终端
4. 在当前位置初始化一个vue的项目:vue init webpack(需要注意最后一步不要自动安装组件了)
5. 手动安装依赖组件:cnpm install
6. 以dev方式运行:cnpm run dev

 
选择 windows x64 insders
安装时直接下一步,有勾的都勾选
VSCode插件:
1. Material Icon Theme:图标
2. Vue文件提示:vetur
3. 中文语言包:chinese

安装node和npm和vue-cli和webpack-cli的更多相关文章

  1. 【vue】Mac上安装Node和NPM

    http://bubkoo.com/2017/01/08/quick-tip-multiple-versions-node-nvm/ 作为前端开发者,node和npm安装必不可少.然而有时会因为安装新 ...

  2. Linux上安装node和npm

    说明:最近工作中需要用到react前端框架使得可以前后分离,在安装react之前呢我是需要先安装node,和npm的 由于npm是依赖于node 的,所以我这边只要安装了node后,npm也就安装完成 ...

  3. nvm安装node和npm,个人踩坑记录

    我采用nvm-setup安装windows版本的nvm nvm安装node出现的问题: 1.node成功了,npm没成功 解决:在nvm 安装了node之后,输入npm找不到该命令,当时安装报错如下: ...

  4. Mac上安装Node和NPM【转】

    http://www.jianshu.com/p/20ea93641bda 作为前端开发者,node和npm安装必不可少.然而有时会因为安装新的app(如MacPorts,慎装,它会修改基本环境变量以 ...

  5. window下安装 node ,并搭建 vue 项目

    uname -a  命令查看到我的Linux系统位数是64位(备注:x86_64表示64位系统, i686 i386表示32位系统) window下安装node 1.在官网上选择对应的位数的msi安装 ...

  6. 安装node.js / npm / express / KMC

    http://www.cnblogs.com/seanlv/archive/2011/11/22/2258716.html 1. 下载Node.js官方Windows版程序: http://nodej ...

  7. window下安装Node.js NPM

    一.安装Node.js 下载地址:http://nodejs.org/download/ 1..msi文件,直接安装,包括了npm,结束. 2..exe文件,把node.exe所在主目录,加入到系统P ...

  8. nvm的安装,安装node,npm

    先说说我为什么使用nvm吧 最近在搞react-native,就碰到了很多坑,其中就有node带来的坑,当你运行react-native start (这是rn启动服务器的命令)就会报一个正则的错误, ...

  9. CentOS 6.5安装Node.js, npm

    CentOS上可以通过下载*.tar.gz安装包的方式自己解压缩.编译的方式安装,同时还可以采用EPEL的方式安装: Node.js and npm are available from the Fe ...

随机推荐

  1. 关于阅读Struts2部分拦截器源码的记录

    Struts2中的拦截器在ActionInvocation对象的invoke()方法中执行. ActionInvocation对象从配置文件中读取Interceptor对象,加入到自己的存取拦截器的容 ...

  2. Zabbix--06主动模式和被动模式、低级自动发现、性能优化、

    目录 一. Zabbix主动模式和被动模式 1.克隆模版 2.修改克隆后的模版为主动模式 3.修改监控主机关联的模版为主动模式 4.修改客户端配置文件并重启 5.查看最新数据 二.Zabbix低级自动 ...

  3. CCPC-Wannafly Winter Camp Day1 (Div2, onsite) 夺宝奇兵

    题目描述 wlswls所在的王国有nn个居民(不包括wlswls),他们共有mm件神奇的宝物. 对于第ii件宝物,wlswls可以花费a_iai​的金币把它从原来的主人那里买过来. 请问wlswls最 ...

  4. “jps”命令的用处?

    jps位于jdk的bin目录下,其作用是显示当前系统的java进程情况,及其id号. jps相当于Solaris进程工具ps.不像”pgrep java” 或”ps -ef grep java”,jp ...

  5. CF1103C Johnny Solving (Codeforces Round #534 (Div. 1)) 思维+构造

    题目传送门 https://codeforces.com/contest/1103/problem/C 题解 这个题还算一个有难度的不错的题目吧. 题目给出了两种回答方式: 找出一条长度 \(\geq ...

  6. Python---进阶---捕获异常

    一.编写一个计算减法的方法,当第一个数小于第二个数时,抛出“被减数不能小于减数”的异常 ------------------------------------------------- def ji ...

  7. 第八周作业—N42-虚怀若谷

    一.显示统计占用系统内存最多的进程,并排序 [root@centos7 ~]# ps -eo uid,pid,ppid,tty,c,time,cmd,%mem --sort=-%mem UID PID ...

  8. React Native 之 createBottomTabNavigator,createMaterialTopTabNavigator

    icon第三方库 yarn add react-native-vector-icons react-native link react-native-vector-icons 在上次的代码中添加: A ...

  9. FLASH位宽为8、16、32时,CPU与外设之间地址线的连接方法

    转 http://blog.csdn.net/linweig/article/details/5556819 flash连接CPU时,根据不同的数据宽度,比如16位的NOR FLASH (A0-A19 ...

  10. nginx 缓存设置

    浏览器缓存原理 浏览器缓存 HTTP协议定义的缓存机制(如:Expires:Cache-control等) 2.浏览器无缓存 3.客户端有缓存 校验过期机制 校验是否过期                ...