使用命令打包
https://zh.nuxtjs.org/guide/commands
-
配置命令,package.json中添加如下内容、
令 描述 nuxt 启动一个热加载的web服务器(开发模式) nuxt build 利用 webpack 编译应用,压缩 JS 和 CSS 资源(发布用)。 nuxt start 以生产模式启动一个 Web 服务器 (需要先执行nuxt build)。 nuxt generate 编译应用,并依据路由配置生成对应的 HTML 文件 (用于静态站点的部署)。 "scripts": { "dev": "nuxt", "build": "nuxt build", "start": "nuxt start", "generate": "nuxt generate" },
执行
npm run build
-
最简单的部署方式、
-
配置Host + Port
// nuxt.config.js server: { host: '0.0.0.0',// 监听所有外网地址。在生产环境服务器上外网环境就能访问到了,在本地的话,局域网都能访问到了 port: 3000 },
-
压缩发布包
- .nuxt文件夹(Nuxt打包生成的资源文件)
- static文件夹(项目中的静态资源)
- nuxt.config.js(给Nuxt服务来使用的)
- package.json (服务端要安装第三方包)
- package-lock.json
-
发布到服务器端
- 登录服务器
ssh root@113.31.154.5
- 选择一个目录创建一个realworld-nuxtjs文件夹:
mkdir realworld-nuxtjs
\ - cd realworld-nuxtjs进入这个文件夹
- 回到本地,使用scp命令往服务器传压缩包:
scp realworld.zip root@113.31.154.5:/root/realworld-nuxtjs
- 登录服务器
-
解压
- 回到服务器的realworld-nuxtjs文件夹里,此时已经有了一个realworld-.zip文件,执行unzip realworld-.zip对压缩包解压
- 然后使用
ls -a
查看解压后的所有文件
-
安装依赖
npm i
-
启动服务
- 执行
npm run start
- 访问113.31.154.5:3000
- 执行
-
使用PM2在后台启动应用
- Github仓库地址
- 官方文档
- 在生产环境上安装:
npm install --global pm2
- 启动
pm2 start npm -- start
PM2常用命令
命令 | 说明 |
---|---|
pm2 list | 查看应用列表 |
pm2 start | 启动应用 |
pm2 stop | 停止应用 |
pm2 reload | 重载应用 |
pm2 restart | 重启应用 |
pm2 delete | 删除应用 |
自动部署
现代化部署方式(CI/CD)
使用GitHub Actions 实现自动部署
- 环境准备
- linux服务器
- 把代码提交到GitHub远程仓库
echo "# realworld-nuxtjs" >> README.md git init echo node_modules > .gitignore git add . git commit -m "first commit" git remote add origin git@github.com:balabala123/realworld.git git push -u origin master
- 配置GitHub Access Token
- 头像 -> Settings -> Developer settings -> Personal access tokens -> Generate new Token
- Token名称填写Tocken,Select scopes勾选repo,然后滚动到网页最下面点击提交按钮。生成了Token
- 回到羡慕地址下Settings -> Secrets -> New Secrets
- 配置GitHub Actions执行脚本
- 在项目根目录创建.github/workflows目录
- 下载main.yml到workflows目录中
- wget后面的下载地址改为自己的仓库地址
- 在项目里配置HOST、USERNAME、PASSWORD、PORT(注:post默认是22)、
- 提交更新、
git add .
git commit -m
“第一次发布部署-测试”git tag v0.1.0
(通过tag打版)git tag
(查看版本)git push origin v0.1.0
(把本地标签推送到远程仓库,会触发自动构建)
部署时遇到的问题
- 在部署服务器的时候,服务已经起来了,但通过公网ip访问,显示连接不上
-
防火墙设置
-
新建防火墙规则组
-
通过复制新建规则组
-
编辑新防火墙规则组
-
添加具体新规则
-
服务器设置新规则组、
-
服务器内部防火墙设置
# 下面指令可无脑依次执行 # 1.查看防火墙状态 systemctl status firewalld.service # 2.开启防火墙 systemctl start firewalld.service # 3.开放3306端口 firewall-cmd --zone=public --add-port=3306/tcp --permanent # 4.重启防火墙使新设置生效 firewall-cmd --reload # 5.查看已经打开放的端口 firewall-cmd --list-ports 作者:景水 链接:https://juejin.cn/post/6904234342575407111 来源:掘金 著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
-
如果只是练习,可以直接把内部防火墙关掉
systemctl stop firewalld.service # 关闭内部防火墙
-
在服务器中运行npm run start是可以访问了,但是用pm2启动之后还是访问不了、
命令行的方式有些问题. 用配置文件的方式启动运行 -
自动化构建时,遇到的报错
-
获取 node、npm、pm2 的运行路径
whereis node whereis npm whereis pm2
-
根据返回结果,创建软连接(类似于windows中的快捷方式)
sudo ln -s /root/.npm-global/bin/pm2 /usr/bin/pm2 sudo ln -s /usr/local/node/bin/npm /usr/bin/npm sudo ln -s /usr/local/node/bin/node /usr/bin/node
-
-
【node错误】/usr/bin/env: node: No such file or directory
执行npm run xxx的命令的时候,报错,提示如下:/usr/bin/env: node: No such file or directoryln -s /usr/bin/nodejs /usr/bin/node
ln -s /usr/local/NODEJS_HOME/bin/node /usr/bin/node ```
最后,附上两篇帮助很大的文档 解决自动化构建时报错的文档 解決防火墻的