一 环境准备
1.更新软件源软件列表
命令行输入
sudo apt update
2.安装nodejs
命令行输入
sudo apt install nodejs
有提示就输入yes就好
然后命令行查看nodejs版本号,顺便测试nodejs是否正确安装
nodejs -v
二 安装npm和cnpm
1.npm安装
命令行输入
sudo apt install npm
安装好后输入
npm -v
查看是否安装成和当前版本号
2.cnpm安装
由于npm很慢,所以还需要安装cnpm。
使用npm安装cnpm,命令行输入
sudo npm install -g cnpm --registry=https://registry.npm.taobao.org
这里可能需要一段时间,但如果一致卡在 loadDep这里,像下面这样,就说明有问题了。
我的解法方法,可能是你的npm版本太低,更新下就好,在命令行输入如下命令:
npm install -g npm
再重启终端,执行 npm -v
就可以看到最新版的npm(我上面的npm版本就是最新版的),再安装cnpm就可以了,我就这样解决了。
最后输入cnpm -v
,查看是否安装成功和查看版本号
三.vue安装
1.安装vue-cli
首先安装脚手架工具vue-cli
命令行输入
sudo cnpm install -g vue-cli
输入vue -V
查看Vue版本号,顺便测试是否正确安装,至此Vue安装便已经完成
2.创建Vue项目
创建Vue项目demo
sudo vue init webpack demo
然后提示你输入一些东西,看着来就行,一般输入no就行了
进入项目文件夹内(cd demo
),并安装项目依赖(sudo cnpm install
),
然后运行项目(sudo npm run dev
),等一会就可以了。
然后运行成功会提示我们项目访问地址,输入地址就可访问了。
在网站看到下面这个就OK啦
不过现在只能在你的电脑访问,下个博客说如何在服务器把vue项目部署到Nginx,使得能在外网访问你的项目,同时加上tornado后端反馈。