1. 创建项目
这个不分不多赘述,根据官网创建对应项目 https://nuxtjs.org/docs/get-started/installation
2. 打包的两种方式
2.1 静态部署
nuxt.config.js
: 文件需要对不同打包方式进行配置
js
target: "static" // build静态部署,默认为server
- generate打包
shell
npm run generate
生成dist
文件夹,直接放到有nginx
的服务器上就可以访问了
2.2 ssr部署
nuxt.config.js
:将target设置为server,或者删除target的设置
js
target: "server"
// 新增host,这个端口则是部署到服务器要访问的端口
server: {
port: 8333,
host: '0.0.0.0'
}
- 新增
ecosystem.config.js
: 为了后期使用pm2启动项目
js
module.exports = {
apps: [
{
name: 'youproject-name', // 你的项目名
exec_mode: 'cluster',
instances: 'max',
script: './node_modules/nuxt/bin/nuxt.js',
args: 'start',
},
],
}
- 修改package.json
json
// 新增一行
"scripjt": {
"pm2": "pm2 start npm --name project-name -- run start --watch"
}
- 打包
shell
npm run build
- 查找需要部署的文件夹和文件
js
.nuxt
static
package.json
nuxt.config.js
ecosystem.config.js
- 将上述文件打包,并放入服务器上
- 使用scp上传到服务器
- 在服务器上安装
pm2
- 给你的项目创建一个文件夹,将打包的文件解压到文件夹内
npm i
安装依赖npm run start
: 看看项目是否能正常运行npm run pm2
: 开启pm2守护进程,启动项目
- 通过 服务器
ip地址:8333
来访问此项目