CentOS Linux release 7.3.1611安装vue.js包含npm和cnpm详细教程

最近在弄linux系统的环境，搭建vue环境，由于是第一次接触vue以前也没使用过，所以才搭建环境的时候还是挺闷逼的。记录一下，免得以后忘记了。

安装cnpm

由于不知道vue和npm的关系，所以自己想先安装npm并设置成阿里的cnpm镜像，然后再安装vue。想想也是醉了！npm是vue管理jar包的工具。vue是自带npm的。所以你在安装玩vue之后才会有npm。于是下面的报错成了第一个！！！！！

[root@iZwz9iy3ddbpjZ ~]# npm install -g cnpm --registry=https://registry.npm.taobao.org
-bash: npm: command not found

安装nodejs

首先使用命令yum install epel-release安装。

为什么使用这个命令请看：http://blog.youkuaiyun.com/yasi_xi/article/details/11746255说的很详细也很好。

然后使用命令yum install nodejs。报错如下：

[root@nodejs ~]# yum install nodejs

Loaded plugins: fastestmirror

Repository base is listed more than once in the configuration

Repository updates is listed more than once in the configuration

Repository extras is listed more than once in the configuration

Repository centosplus is listed more than once in the configuration

Loading mirror speeds from cached hostfile

原因是http://m.blog.youkuaiyun.com/u012251305/article/details/77345766

解决方法：rpm -ivh https://kojipkgs.fedoraproject.org//packages/http-parser/2.7.1/3.el7/x86_64/http-parser-2.7.1-3.el7.x86_64.rpm && yum -y install nodejs

命令执行结果：

[root@iZwz9iy3ddbp ~]# rpm -ivh https://kojipkgs.fedoraproject.org//packages/http-parser/2.7.1/3.el7/x86_64/http-parser-2.7.1-3.el7.x86_64.rpm && yum -y install nodejs
Retrieving https://kojipkgs.fedoraproject.org//packages/http-parser/2.7.1/3.el7/x86_64/http-parser-2.7.1-3.el7.x86_64.rpm
Preparing...                          ################################# [100%]
Updating / installing...
   1:http-parser-2.7.1-3.el7          ################################# [100%]

信息太多不一一贴出来了！

查看node版本：命令

[root@iZwz9iy3ddbp ~]# node -v
v6.11.1

查看npm版本命令：

[root@iZwz9iy3ddbp ~]# npm -v
3.10.10

安装cnpm命令：

[root@iZwz9iy3ddbp~]# npm install -g cnpm --registry=https://registry.npm.taobao.org    命令执行结果如下：

[root@iZwz9iy3ddbp4396q2tpwjZ ~]# npm install -g cnpm --registry=https://registry.npm.taobao.org
/usr/bin/cnpm -> /usr/lib/node_modules/cnpm/bin/cnpm
/usr/lib
└─┬ cnpm@5.1.1 
  ├── auto-correct@1.0.0 
  ├── bagpipe@0.3.5 
  ├── colors@1.1.2 
  ├─┬ commander@2.10.0 
  │ └── graceful-readlink@1.0.1 
  ├─┬ cross-spawn@0.2.9 
  │ └── lru-cache@2.7.3 
  ├─┬ debug@2.6.8 
  │ └── ms@2.0.0 
  ├── giturl@1.0.0 
  ├── ini@1.3.4 

信息太多不一一贴出来了！

更换npm源

npm configset registry https://registry.npm.taobao.org

// 配置后可通过下面方式来验证是否成功

npm configget registry

// 或

npm info express

查看更换结果：

[root@iZwz9iy3ddbp ~]# npm config set registry https://registry.npm.taobao.org
[root@iZwz9iy3ddbp ~]# npm config get registry
https://registry.npm.taobao.org/

更换成功！

其他详细命令请看博客：http://blog.youkuaiyun.com/quuqu/article/details/64121812

安装vue-cli脚手架

cnpm install -g vue-cli

参数： 

-g 表示全局安装。不加的话，就是当前目录安装。

[root@iZwz9iy3ddbp ~]# vue --version

2.8.1

创建一个基于 webpack 模板的新项目

我本地目录是/vue/project 备注：根据自己本地新建的来没有限制

执行命令：

cd/vue/project

vue init webpack my-project

# 安装依赖

cd my-project

npm instal

npm run dev

[root@iZwz9iy3ddbp ~]# cd /vue/project/my-project
[root@iZwz9iy3ddbp my-project]# npm install
my-project@1.0.0 /vue/project/my-project
└── (empty)

npm ERR! code 1
[root@iZwz9iy3ddbp my-project]# npm run dev
> my-project@1.0.0 dev /vue/project/my-project
> node build/dev-server.js
> Starting dev server...

 DONE  Compiled successfully in 2960ms  5:28:22 PM

> Listening at http://localhost:8080

(node:15280) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: Exited with code 3

看着报错了但是启动没什么问题，网上说新版本都有这个警告所以试试访问结果！

注意系统8080端口是否开启：

# centos7 默认是安装了firewalld防火墙的

# 永久开放端口

firewall-cmd --permanent --add-port={8090/tcp,8080/tcp}

# 重启防火墙

firewall-cmd --reload

# 查看防火墙状态

firewall-cmd --state

# 显示目前的设定

firewall --cmd --list --all

如果以上命令执行之后没有结果，登录你的阿里云账号在控制台设置下端口的进入进出问题。具体教程请百度！

OK！到这里告一段落下一篇写下vue的版本库问题！