MAC nodejs安装步骤及其web后续运行到浏览器命令显示问题

1,首先nodejs的安装

下载nodejs

访问nodejs官网（https://nodejs.org/en/）选择mac的（就是傻瓜式安装）

2,安装完成后打开终端，输入 

命令：node -v 查看是否安装了nodejs （有版本号即成功）

命令：npm -v 查看是否安装了npm (有版本号即成功)

说明：npm是node的包管理工具，默认安装完node之后，npm会自动安装上的。

3,配置node环境

a. 去终端，打开配置文件

vi ./.bash_profile

b. 添加一行PATH（按i进入insert才能编辑）

PATH=$PATH:/usr/local/bin/node  (我是这样子放的) ,把/usr/local/bin/换成你的npm全局包路径)

路径的查看方式为：which node

c. 按esc退出insert，输入:wq，按回车，保存文件，配置成功

4,安装淘宝镜像

（项目的根目录奥，就是你要运行的项目文件进去，执行的命令，我这边是从git上拉取的项目，你要是没有项目自己新建一个项目然后再运行奥）

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

        sudo  npm install --registry=https://registry.npm.taobao.org  (这俩都行这，俩都行，我做个一般在项目的那个里面用)

    ⚠️ (亲们，mac的一定要加sudo，我报错了是因为mac没显示那个本机权限密码，那个password🔑输入你的本机开机密码就行了)

5,安装Vue.js 的官方命令行工具：

# 全局安装 vue-cli
sudo cnpm install --global vue-cli
# 或
cnpm install -g vue-cli

5,nodejs版本降级（不需要的忽略，跳过）

运行安装node.js的时候，发现安装了最新的12版本，但是因为项目的原因，我需要node.js版本为8.0版本。我的安装命令为：

解决方法

sudo npm install -g n

sudo n 8.16.0

就行了。

6,安装webpack

在终端输入：

sudo cnpm install webpack -g (以后我们会和webpack打很长时间的交道创建项目会用到)

• 解决方法：执行三个命令检查环境

1. node -v
2. vue -v? (没有显示版本，npm i vue-cli -g)
3. webpack-v(需要重新安装,npm install webpack -g)

• 三个条件满足时，运行vue init webpack demo（demo项目名）
• 安装webpack时如果报错 Unexpected end of JSON input while parsing near '…"，用以下步骤解决：
• 解决办法：
  （1）npm install --registry=https://registry.npm.taobao.org --loglevel=silly
  （2） npm cache clean --force
  （3） npm install

7，安装vue脚手架

这个工具是自动搭建vue项目框架的工具，还算好用，没得选只此一家。

终端输入：

sudo npm install -g vue-cli

8，启动项目（项目根目录哈）

先执行  sudo npm install 安装依赖  (安装依赖包，就跟maven包一样，把依赖下载到本地，在运行项目)

sudo npm run dev 或 npm run serve 启动项目（安装依赖完成后，启动项目，在终端输入：）

9，访问http://localhsot:8080，打开vue项目

10，到这边上面基本上都完成了，如果遇到这个问题如下解决：

ERROR  Error: Rule can only have one resource source (provided resource and test + include + exclude) in {

  "exclude": [....

原因分析：

package.json中webpack版本冲突问题。

解决方案：

删除webpack，重新装以前的版本。
npm uninstall webpack
npm install webpack@^4.0.0 --save-dev