windows下Vue安装教程(超级详细,一些细节坑)

Vue安装教程(超级详细,一些细节坑)

1、安装Node.js

windows下Vue安装教程(超级详细,一些细节坑)_第1张图片
注意如果你是linux安装的话,需要安装python2.6或者2.7版本的,不建议安装python3.0以上的。

2、windows下Vue安装教程(超级详细,一些细节坑)_第2张图片
2.
windows下Vue安装教程(超级详细,一些细节坑)_第3张图片
3.
windows下Vue安装教程(超级详细,一些细节坑)_第4张图片
4.
windows下Vue安装教程(超级详细,一些细节坑)_第5张图片
5、
windows下Vue安装教程(超级详细,一些细节坑)_第6张图片
6.
windows下Vue安装教程(超级详细,一些细节坑)_第7张图片
7、
windows下Vue安装教程(超级详细,一些细节坑)_第8张图片
8、下面看path环境变量中是否配置了Node.js,在cmd中输入path(因为之前我安装在D盘了,所以我从D盘里面找的)
windows下Vue安装教程(超级详细,一些细节坑)_第9张图片
9,这里已经进行了一半啦
下面安装windows二进制文件(.exe)的安装,注意还是这个页面Node.js点击windows binary

windows下Vue安装教程(超级详细,一些细节坑)_第10张图片
10.解压完了之后点击node.exe文件运行如下
windows下Vue安装教程(超级详细,一些细节坑)_第11张图片
11.在cmd下输入下面这一行命令,利用淘宝
回车之后,等待安装,这是使用管理员身份安装的

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

在这里插入图片描述
问题出现了,报了警告
windows下Vue安装教程(超级详细,一些细节坑)_第12张图片
解决方法:
(1)查看你安装的node.js全局安装路径,然后配置到你的环境变量中去(哈哈哈,还不如不打码,费事,下面不打了)
windows下Vue安装教程(超级详细,一些细节坑)_第13张图片
建议不要更改,再改回来吧,因为很麻烦都是泪啊(我已经搞了一上午了,哭唧唧)
输入下面截图中的命令:

然后我又出现了这个问题
windows下Vue安装教程(超级详细,一些细节坑)_第14张图片
windows下Vue安装教程(超级详细,一些细节坑)_第15张图片
解决方法:
找到这个路径:
(根据你自己默认的全局路径啊,一定啊,如果你上一步修改了,就是修改之后的(建议默认吧,也没啥事))

C:\Users\zxc\AppData\Roaming\npm\node_modules\nrm\cli.js:17:20

windows下Vue安装教程(超级详细,一些细节坑)_第16张图片
改为:
在这里插入图片描述
下面可以直接复制:

const NRMRC = path.join(process.env[(process.platform == 'win32') ? 'USERPROFILE' : 'HOME'],'.nrmrc');

yeah successful.
windows下Vue安装教程(超级详细,一些细节坑)_第17张图片
(虽然这里只显示几张错误,但是我中间尝试了好多呀,哭唧唧,老板给我加钱!!!!)

ok,接着前面的11继续

12.安装全局,vue-cli 这是用于帮助搭建所需的模板框架,在cmd中输入

cnpm install -g vue-cli

下面出现了这个情况,不要慌(其实我当时害怕极了)
windows下Vue安装教程(超级详细,一些细节坑)_第18张图片
输入vue显示信息就表示安装成功啦
windows下Vue安装教程(超级详细,一些细节坑)_第19张图片
13.创建一个项目
在cmd输入 vue init webpack vue_test
然后出现一系列的提示,你先看看截图的内容,注意,author不要写你目录的名称,我那写成zxc了,所以有丢丢问题,影响不大啊
windows下Vue安装教程(超级详细,一些细节坑)_第20张图片
然后中间加载一大堆东西,你等着就好啦,什么都不要做,最后出现这个就好啦。
windows下Vue安装教程(超级详细,一些细节坑)_第21张图片
14、
安装依赖
windows下Vue安装教程(超级详细,一些细节坑)_第22张图片
windows下Vue安装教程(超级详细,一些细节坑)_第23张图片
windows下Vue安装教程(超级详细,一些细节坑)_第24张图片
好啦,然后进入8080就可以看见你创建的项目啦。
今天先到这吧,心累。

你可能感兴趣的:(实用,vue,npm)