在Mac上安装node、npm、webpack

1.安装node.js

点击下载pkg安装包,进行安装。

2.验证安装状态

输入node -v 和 npm -v 检查是否安装成功，出现版本号，证明安装成功。

3.安装cli脚手架

在终端输入 npm install --global vue-cli这行命令并执行,执行以后有很大概率出现错误

错误信息

主要错误信息是

The operation was rejected by your operating system.
It is likely you do not have the permissions to access this file as the current user

翻译一下是说我们没有权限,解决方法是：
执行 sudo chown -R $USER /usr/local,
然后输入密码，
再次执行npm install --global vue-cli命令即可。

成功安装脚手架

4.安装webpack

到这里我们已经配置好了node环境，并且安装了脚手架,接下来就可以安装webpack了,执行命令
npm install webpack@3.6.0 -g进行安装。

webpack安装成功

这里需要注意一下,执行完命令以后,我们安装的是vue2.x的版本,这里我忽略掉了,本打算切换完路径以后通过vue create myproject新建项目的,然后vscode就给我提示了.

提示

这里我们可以通过vscode的提示,先执行

npm uninstall -g vue-cli

卸载掉2.x的版本,然后通过

npm install -g @vue/cli

安装3.x的版本再去执行新建项目的命令就可以了.当然我们也可以直接用2.x的方式新建项目,正确做法是将新建项目的命令改成

vue init webpack myproject

执行即可。

项目创建成功

新建好了项目,按照vscode的提示,执行cd myproject命令和npm run dev,将项目运行起来。

项目运行起来了

在浏览器打开地址 http://localhost:8080,看到如下内容,证明项目新建成功。

项目页面