mac os 安装vue

最近使用django做了个后端，打算用vue来做前端的工作，故整理了一个简单的教程。

一：安装vue

1.安装node.js

https://nodejs.org/zh-cn/download/

下载macos版本，一路点击继续即可。

2.安装cnpm

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

在mac下，直接执行这个命令会报错，会提示权限不够permission denied
 

npm WARN deprecated socks@1.1.10: If using 2.x branch, please upgrade to at least 2.1.6 to avoid a serious bug with socket data flow and an import issue introduced in 2.1.0
npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules
npm ERR! path /usr/local/lib/node_modules
npm ERR! code EACCES
npm ERR! errno -13
npm ERR! syscall access
npm ERR! Error: EACCES: permission denied, access '/usr/local/lib/node_modules'
npm ERR!  { [Error: EACCES: permission denied, access '/usr/local/lib/node_modules']
npm ERR!   stack:
npm ERR!    'Error: EACCES: permission denied, access \'/usr/local/lib/node_modules\'',
npm ERR!   errno: -13,
npm ERR!   code: 'EACCES',
npm ERR!   syscall: 'access',
npm ERR!   path: '/usr/local/lib/node_modules' }
npm ERR! 
npm ERR! The operation was rejected by your operating system.
npm ERR! It is likely you do not have the permissions to access this file as the current user
npm ERR! 
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator (though this is not recommended).

此处需要用

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

安装完成后，会有提示

+ npm@6.9.0
added 426 packages from 800 contributors and audited 12096 packages in 19.276s
found 0 vulnerabilities

3.接下来安装vue-cli

这里同样也是得sudo 下执行

sudo cnpm install -g vue-cli

安装成功后，会有提示，至此已经完成vue的安装，接下来就是创建第一个项目

All packages installed (238 packages installed from npm registry, used 13s(network 13s), speed 393.37kB/s, json 223(408.96kB), tarball 4.72MB)
[vue-cli@2.9.6] link /usr/local/bin/vue@ -> /usr/local/lib/node_modules/vue-cli/bin/vue
[vue-cli@2.9.6] link /usr/local/bin/vue-init@ -> /usr/local/lib/node_modules/vue-cli/bin/vue-init
[vue-cli@2.9.6] link /usr/local/bin/vue-list@ -> /usr/local/lib/node_modules/vue-cli/bin/vue-list

4.进入项目文件夹

 

5执行

vue-init webpack vuetest

其中vuetest为项目的名称，按自己的需求设定。