ubuntu上安装vue-cli

写在前面

因为想模拟比赛环境,所以搭建一个go gin框架+vue.js,gin框架已经搞定,所以在弄vue.js,但是今天一下午折腾了挺久也没弄出来,后来找到了解决办法。顺便也记录一下免得下次遇到相同的问题又去百度。

搭建nodejs

搭建nodejs的话就很简单了,直接打命令就好了

1
sudo apt install nodejs

然后在node -v看看有版本吗,有就没问题
然后就是安装npm和cnpm了(安装cnpm主要是npm太慢了)
npm的安装也是直接命令就好

1
sudo apt-get install npm

检测就是npm -v就好了,显示版本就表示安装成功

然后安装cnpm软件包

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

然后就是跟着步骤来。
清除node缓存;

1
sudo npm cache clean -f

安装node版本管理工具’n’;

1
sudo npm install n -g

使用版本管理工具安装指定node或者升级到最新node版本;

1
2
3
sudo n stable  (安装node最新版本)

sudo n 10.6.0 (安装node指定版本10.6.0

使用node -v查看node版本,如果版本号改变为你想要的则升级成功。

使用如下命令将vue-cli全局安装到系统环境中

1
sudo cnpm install -g vue-cli

创建一个基于”webpack”模板的新项目my-vuejs(项目名称自定)

vue init webpack my-vuejs  ```
1
2
3
4
5
6
7
8
9
10
此时会提示一些参数: 
```base
? Project name (my-vuejs) : #是否给定项目名称,否则使用括号内的名称,直接回车即可 
? Project description (A Vue.js project) : #是否给定项目描述,根据个人需要 
? Author (Lex <1612944051@qq.com>) : #作者 
然后出现很长一段文字,直接回车 
? Install vue-router? (Y/n) #是否安装路由,选择Y 
? Use ESLint to lint your code? (Y/n) #选择n 
? Setup unit tests with Karma + Mocha? (Y/n) #选择n 
? Setup e2e tests with Nightwatch? (Y/n) #选择n

然后模板就下载完了。

进入模板目录,使用install命令安装该模板所需依赖

1
cnpm install

使用如下命令运行

1
cnpm run dev

然后就可以快乐的玩耍了

遇到的问题

安装npm的时候遇到类似报错

1
2
3
The following packages have unmet dependencies:
npm : Depends: node-gyp (>= 0.10.9) but it is not going to be installed
E: Unable to correct problems, you have held broken packages.

输入如下命令解决问题

1
sudo apt-get install nodejs-dev node-gyp libssl1.0-dev