2019-06-29 Mac下vue的安装

1、vue.min.js文件获取：
直接下载后将其放入工程中，引用该文件：

链接：https://vuejs.org/js/vue.min.js

或者，使用CDN，以下推荐国外比较稳定的两个 CDN，国内还没发现哪一家比较好，目前还是建议下载到本地：

• BootCDN（国内） : https://cdn.bootcss.com/vue/2.2.2/vue.min.js

• unpkg：https://unpkg.com/vue/dist/vue.js, 会保持和 npm 发布的最新的版本一致。

• cdnjs : https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js

之后就和正常的js一样引用，如：

2、下载安装node

官网：https://nodejs.org/en/download/

下载安装node

image

3、cnpm代替npm
国内直接使用 npm 的官方镜像是非常慢的，推荐使用淘宝 NPM 镜像：

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

之后就可以使用淘宝定制的 cnpm 命令行工具，来安装模块了：

cnpm install [name]

4、安装Vue.js 的官方命令行工具：

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

image

5、创建一个新的项目：

# 创建一个基于 webpack 模板的新项目
vue init webpack my-project
# 这里需要进行一些配置，默认回车即可

image

报错，这个错误是node_modules带来的，先忽略：

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: node install.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above

6、运行项目：

cd my-project
cnpm install # 安装依赖，安装在node_modules文件夹
cnpm run dev #运行项目

image

image

参考资料：https://blog.csdn.net/m0_37479246/article/details/78836686
http://www.runoob.com/vue2/vue-install.html
https://blog.csdn.net/gh254172840/article/details/78871573
https://blog.csdn.net/qq_34233232/article/details/78178362