- 使用vscode插件Remote - SSH 连接访问Linux服务器
- Linux安装nodejs
- 安装cnpm国内资源镜像
- 上传vue项目
- 在Linux上解压vue项目
- 下载项目所需依赖包
- 修改vue-cli-service 的权限
- 启动项目npm run serve
- 解决vue-cli热刷新失效的问题
1. 使用vscode插件Remote - SSH 连接访问Linux服务器
在VSCode中安装remote ssh 插件
打开远程资源管理器,添加配置信息
最后,进行连接即可
2. Linux安装nodejs
wget https://nodejs.org/dist/v16.13.1/node-v16.13.1-linux-x64.tar.xz // 下载
tar xf node-v16.13.1-linux-x64.tar.xz // 解压
cd node-v16.13.1-linux-x64
cp /etc/profile /etc/profile.bak // 修改前备份一下
vim /etc/profile
在最下面添加 export PATH=$PATH: 后面跟上 node 下 bin 目录的路径:
export PATH=$PATH:/root/vue/node-v16.13.1-linux-x64/bin
**source /etc/profile 立即生效**
**node -v 查看node版本**
npm -v 查看npm版本
3.安装cnpm国内资源镜像
**npm install -g cnpm --registry=http://registry.npm.taobao.org**
4.上传vue项目
打开cmd 进入项目压缩包所在目录,输入sftp 输出如下结果即可进行下一步
**sftp songyh@47.102.153.128**
**输入密码**
**put dist.zip**
5. 在Linux上解压vue项目
**mkdir h5 // 新建文件夹**
**cd h5**
**unzip /home/yuhua/dist.zip // 解压项目文件 **
通过vscode远程查看刚解压的vue项目
6. 下载项目所需依赖包
因为环境不同,对应依赖包不同,先将旧的node_modules文件夹删除
在项目根目录打开终端
**cnpm i // 下载依赖包**
7. 修改vue-cli-service 的权限
执行npm run serve 时提示Permission denied
**ll vue-cli-service // 查看该文件**
发现权限不够
**chmod +x vue-cli-service // 修改权限**
8. 启动项目npm run serve
**npm run serve**
9. 解决vue-cli热刷新失效的问题
当我们修改代码时,发现vue不会自动刷新,需要手动重启服务,非常麻烦,需要在终端输入如下代码已解决热刷新失效的问题
**echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && so sysctl -p**