Nuxt通过iis打包部署到线上

1,523 阅读2分钟

generate打包

这是静态部署,比较简单

npm run generate

生成dist文件夹,直接放到服务器就可以访问
但是如果后台修改数据,前端还是显示之前打包的数据

项目nuxt.config.js配置的server(反向代理)

  server: {
    port: 3000,
    host: '0.0.0.0',
    timing: false
  },

build打包

npm run build

1| .nuxt
2| static
3| nuxt.config.js
4| package.json

把这四个文件放到远程服务器中的文件夹里
在远程服务器中安装node
cmd这个文件夹,执行

npm install
npm run start

就能生成个本地链接进行访问

pm2守护进程(服务器开机自启动)

用管理员启动cmd,全局安装pm2

npm install pm2 -g

然后安装pm2开机自启动 :

npm i -g pm2-windows-service

安装完成后重启服务器
以管理员权限打开新的cmd命令行窗口,执行以下命令来安装服务:

 pm2-service-install

项目目录下执行

pm2 start //启动进程

image.png 如果你的运行状态为:online,说明正常。

如果你运行后状态为:stopped,说明没有正常启动,百度搜索了以下,有人说是node.js没有权限操作cmd控制台。

于是我跟着操作,问题解决:

安装依赖:

npm install node-cmd

然后在项目根目录创建一个:start.js,内容如下:

const cmd=require('node-cmd'); 
cmd.run('npm start');

然后在cmd执行:

 pm2 start start.js
 

发现运行成功,但是有个小黑框,关掉后无法运行网站就无法访问。

但是我无意间发现,重启一下服务器,此问题得到解决。

image.png

pm2常规命令

pm2 delete id  //删除指定id的pm2进程 
pm2 delete all //删除全部进程
pm2 list       //查看所有pm2进程
pm2 restart [name] //重启进程

pm2可以关闭了node服务窗口,还可以继续访问链接服务
在服务器项目的根目录新建ecosystem.config.js文件

module.exports = {
  apps: [
    {
      name: 'haoshunjiah5',//自定义的pm2中name唯一值
      exec_mode: 'cluster',
      instances: 'max', // Or a number of instances
      script: './node_modules/nuxt/bin/nuxt.js',
      args: 'start'
    }
  ]
}

nxut网站运行正常之后,将其添加到开机启动

pm2 save

然后重启服务器,cmd执行

pm2 ls

image.png

IIS发布网站

如果你的iis没有Application Request Routing Cache
需要进行安装->安装地址:www.iis.net/downloads/m…

1.配置Application打开IIS->选中服务器名称->双击 右侧功能视图 IIS 节点下的Application Request Routing Cache->点击 右侧操作视图Proxy节点下的Server Proxy Settings->勾选上Enable Proxy前面的复选框

image.png

右键》Application Request Routing Cache》打开功能》

image.png

右侧》找到Proxy》点击 server Proxy Settings

image.png

勾选上Enable Proxy前面的复选框>点击应用

image.png

添加站点

image.png

选择网站,新建配置自己的项目域名

image.png 然后选中刚刚发布的网站,选中url重写,添加规则 image.png image.png

image.png

模式:^(.*)

条件:{HTTP_HOST}    ^www.xxxx.com(你的域名)$

重写url:http://127.0.0.1:3000/{R:1} 

image.png

这个规则名称可以自定义

image.png

这个重写url是固定的,要换只是换端口号,与项目上的那个相互匹配port: 3000,