ubuntu21.04(linux):安装node(14.17.1)和vue.js3.1环境
2023-09-14 08:59:32 时间
一,下载node:
访问:
https://nodejs.org/en/
如图:
![](https://img2020.cnblogs.com/blog/1938691/202106/1938691-20210621151150328-1144317919.png)
我们选择lts版本下载
liuhongdi@lhdpc:/usr/local/source$ wget https://nodejs.org/dist/v14.17.1/node-v14.17.1-linux-x64.tar.xz
解压:
liuhongdi@lhdpc:/usr/local/source$ xz -d node-v14.17.1-linux-x64.tar.xz liuhongdi@lhdpc:/usr/local/source$ tar -xvf node-v14.17.1-linux-x64.tar
说明:刘宏缔的架构森林是一个专注架构的博客,地址:https://www.cnblogs.com/architectforest
对应的源码可以访问这里获取: https://github.com/liuhongdi/
说明:作者:刘宏缔 邮箱: 371125307@qq.com
二,安装node
移动到软件安装目录
liuhongdi@lhdpc:/usr/local/source$ mv node-v14.17.1-linux-x64 /usr/local/soft/
创建符号链接:
root@lhdpc:~# ln -s /usr/local/soft/node-v14.17.1-linux-x64/bin/node /usr/local/bin/node root@lhdpc:~# ln -s /usr/local/soft/node-v14.17.1-linux-x64/bin/npm /usr/local/bin/npm
查看效果:
liuhongdi@lhdpc:/usr/local/source$ node -v v14.17.1 liuhongdi@lhdpc:/usr/local/source$ npm -v 6.14.13
三,安装cnpm
安装
liuhongdi@lhdpc:/usr/local/source$ npm install -g cnpm --registry=https://registry.npm.taobao.org
创建符号链接
root@lhdpc:~# ln -s /usr/local/soft/node-v14.17.1-linux-x64/bin/cnpm /usr/local/bin/cnpm
测试效果
root@lhdpc:~# cnpm -v cnpm@6.2.0 (/usr/local/soft/node-v14.17.1-linux-x64/lib/node_modules/cnpm/lib/parse_argv.js) npm@6.14.13 (/usr/local/soft/node-v14.17.1-linux-x64/lib/node_modules/cnpm/node_modules/npm/lib/npm.js) node@14.17.1 (/usr/local/soft/node-v14.17.1-linux-x64/bin/node) npminstall@3.28.0 (/usr/local/soft/node-v14.17.1-linux-x64/lib/node_modules/cnpm/node_modules/npminstall/lib/index.js) prefix=/usr/local/soft/node-v14.17.1-linux-x64 linux x64 5.11.0-18-generic registry=https://registry.nlark.com
四,安装vue-cli
安装
liuhongdi@lhdpc:/usr/local/source$ npm install -g @vue/cli
创建符号链接
root@lhdpc:~# ln -s /usr/local/soft/node-v14.17.1-linux-x64/bin/vue /usr/local/bin/vue
查看文件
root@lhdpc:~# whereis vue vue: /usr/local/bin/vue
查看版本
root@lhdpc:~# vue -V @vue/cli 4.5.13
五,创建一个vue.js项目:
创建项目vuedemo1
liuhongdi@lhdpc:/data/vue$ vue create vuedemo1
如图:
![](https://img2020.cnblogs.com/blog/1938691/202106/1938691-20210621151150328-558405893.png)
选择vue3后回车
![](https://img2020.cnblogs.com/blog/1938691/202106/1938691-20210621151150356-1346840330.png)
按照提示进行操作:
liuhongdi@lhdpc:/data/vue$ cd vuedemo1/
liuhongdi@lhdpc:/data/vue/vuedemo1$ npm run serve
查看vue.js的版本:
liuhongdi@lhdpc:/data/vue/vuedemo1$ npm list vue vuedemo1@0.1.0 /data/vue/vuedemo1 └── vue@3.1.1
通过浏览器查看项目效果
![](https://img2020.cnblogs.com/blog/1938691/202106/1938691-20210621151150328-1885200754.png)
六,查看linux版本:
liuhongdi@lhdpc:/data/vue/vuedemo1$ cat /etc/os-release NAME="Ubuntu" VERSION="21.04 (Hirsute Hippo)" ID=ubuntu ID_LIKE=debian PRETTY_NAME="Ubuntu 21.04" VERSION_ID="21.04" HOME_URL="https://www.ubuntu.com/" SUPPORT_URL="https://help.ubuntu.com/" BUG_REPORT_URL="https://bugs.launchpad.net/ubuntu/" PRIVACY_POLICY_URL="https://www.ubuntu.com/legal/terms-and-policies/privacy-policy" VERSION_CODENAME=hirsute UBUNTU_CODENAME=hirsute
相关文章
- 简化了IT 工作Linux: 简化 IT 工作的救星(linux帮助)
- 动态网站Linux安装DZ动态网站:快速搭建你的网站(linux安装dz)
- Linux 中定义函数的简单方法(linux定义函数)
- 简单步骤:Linux下利用画图工具创作美丽图形(linux画图c)
- Linux下的时间统计函数的使用介绍(linux时间统计函数)
- Linux根分区扩容:实现容量上的提升(linux根分区扩展)
- Linux下如何修改用户名及密码(linux修改用户和密码)
- 管理拓展使用:Linux资源管理的技巧与技术(linux资源)
- Linux防火墙安装视频教学(linux防火墙安装视频)
- Linux设备驱动:驱动快速安装,轻松简单!(linux设备驱动下载)
- 比较VxWorks和Linux的优势和劣势(vxworks和linux)
- 安装Linux下的LZMA压缩工具(linux安装lzma)
- Linux系统上快速安装FMS(linux安装fms)
- Linux文件映射实现快速访问(linux文件映射)
- 安装Linux下RPM安装简史(linux下的rpm)
- Linux系统下安装Win7:唤醒双系统兼容之夜(linux系统下安装win7)
- 安装Linux:掌握安装包命令(linux安装包命令)
- Linux下安装软件的命令指南(linux下载软件的命令)
- 应用Linux在平板设备上的新潮应用(linux的平板)
- 如何在Linux环境下绑定域名?——25字(绑定域名linux)
- QQ国际版在Linux上的安装和使用指南(qq国际版linux)
- 如何在Linux上简便地建立LDAP连接(ldap连接linux)
- 键盘记录在Linux上开启新世界(键盘记录 linux)
- Linux安装显卡驱动,轻松搞定!(linux装显卡驱动)
- 如何安装和使用U盘Linux驱动?(u盘linux 驱动)
- Linux与Mac:两大计算机平台的共融之道(linux 与mac)
- 从源代码安装Linux:不在畏惧中前行(linux 源文件安装)
- Linux下实现TCP/IP连接跟踪查看的方法(linux连接跟踪查看)
- Linux网卡缓存提升性能的突破(linux网卡缓存)