Nuxt.js IIS部署,Nuxt.js 发布部署

最新推荐文章于 2024-03-04 12:21:35 发布

橙-极纪元JJYCheng

最新推荐文章于 2024-03-04 12:21:35 发布

阅读量1.7k

点赞数 3

分类专栏： VUE

本文链接：https://blog.csdn.net/cplvfx/article/details/113940057

版权

VUE 专栏收录该内容

58 篇文章

订阅专栏

参考文章

nuxt发布到windows IIS部署（nuxt+node+pm2+iis）
https://blog.csdn.net/qq_24821757/article/details/113250704

nuxt.js express模板项目服务器部署
https://www.cnblogs.com/stealth7/p/7299614.html

nuxt.js express模板项目IIS部署
https://www.cnblogs.com/stealth7/p/7346963.html

官方：https://www.nuxtjs.cn/guide/commands#%E5%8F%91%E5%B8%83%E9%83%A8%E7%BD%B2

你可能用到

vue-cli 安装 2020最新 vue 4.0安装

https://blog.csdn.net/cplvfx/article/details/107184857

第一步：服务器安装node.js环境

1、安装node.js下载地址

http://nodejs.cn/download/

我是全部默认下一步的，安装成功之后运行命令查看是否安装成功

如果没有出现版本号，可能是安装出了问题，请根据情况自行解决。

2、安装ARR(Application Request Routing)

下载地址

https://www.iis.net/downloads/microsoft/application-request-routing

第二步：编译

执行命令：

npm run build

也可以,使用淘宝镜像

cnpm run build

注意：打开项目目录复制以下文件夹到服务器：.nuxt、static、nuxt.config.js、package.json、assets(根据自己项目文件存放情况选择)

第三步：依赖安装

cmd进入nuxt项目文件夹目录，安装依赖

运行命令：

npm install

你也可以运行淘宝镜像的命令

cnpm install

安装完成后，会多出一个文件夹 “node_modules”

接下来，我们先运行一下nuxt项目，看看是否能正常运行：

npm run start

如果能够正常运行，那进入下一步

第四步：守护进程安装pm2(node.js进程守护)

1.全局安装pm2

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

npm i pm2 -g

然后设置pm2开机自启动：

（1）安装并配置：

npm i -g pm2-windows-service

安装完成后重启服务器

(2）添加系统环境变量: PM2_HOME= C:\Users\***\.pm2 (具体路径可用 pm2 -v 查看) 【可省略】

(3) 以管理员权限打开新的cmd命令行窗口,执行以下命令来安装服务:

pm2-service-install

提示Perform environment setup ? 选 n, 继续,此时, PM2服务已安装成功并已启动, 可以通过

win + r

然后，输入

services.msc

来查看，服务名称为PM2

如果 PM2 有异常，或者开机不启动请看

windows系统中安装pm2并设置开机自启动

https://blog.csdn.net/cplvfx/article/details/114059748

2.安装node依赖

npm install node-cmd

然后在项目根目录创建一个：IISTest1.js，内容如下：

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

这个JS文件名，你可以自己设定，例如：start.js

然后在cmd执行：

pm2 start IISTest1.js --name "IISTest1.js"

--name "你要取得名称"

注意：此时你执行的cmd的路径是在项目路径下

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

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

如果你的运行状态为：online，说明正常。

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

一般情况下只要安装了【node依赖】就不会出现stopped问题

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

pm2 save

然后重启服务器，cmd执行

pm2 ls

查看当前托管运行的网站是否正常：

一定要保存pm2

执行命令：
pm2 save

4.pm2常用命令

全局安装，简直不能更简单。

npm install -g pm2

常用命令

启动

参数说明：

--watch：监听应用目录的变化，一旦发生变化，自动重启。如果要精确监听、不见听的目录，最好通过配置文件。
-i --instances：启用多少个实例，可用于负载均衡。如果-i 0或者-i max，则根据当前机器核数确定实例数目。
--ignore-watch：排除监听的目录/文件，可以是特定的文件名，也可以是正则。比如--ignore-watch="test node_modules "some scripts""
-n --name：应用的名称。查看应用信息的时候可以用到。
-o --output <path>：标准输出日志文件的路径。
-e --error <path>：错误输出日志文件的路径。
--interpreter <interpreter>：the interpreter pm2 should use for executing app (bash, python...)。比如你用的coffee script来编写应用。

完整命令行参数列表：地址

pm2 start app.js --watch -i 2

重启

pm2 restart app.js

停止

停止特定的应用。可以先通过pm2 list获取应用的名字（--name指定的）或者进程id。

pm2 stop app_name|app_id

如果要停止所有应用，可以

pm2 stop all

删除

类似pm2 stop，如下

```
pm2 del app_name|app_id
```
```
pm2 del all
```

查看进程状态

pm2 list

更多你可以看

PM2实用入门指南

https://www.cnblogs.com/chyingp/p/pm2-documentation.html

第五步：IIS发布网站

1.配置Application

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

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

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

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

2.添加站点

目录选择nuxt项目文件夹，配置自己的项目域名

然后选中刚刚发布test网站，选中url重写》添加规则》反向代理》输入刚才跑起来的地址 http://localhost:3000/ 或者http://127.0.0.1:3000/（“http://”不需要输入）

如果你的IIS上没有URL重写，关闭IIS 重新打开下，如果还是没有(关闭IIS界面重新打开)

需要下载 urlrewrite

下载地址https://www.iis.net/downloads/microsoft/url-rewrite

---------------------------------

关闭IIS 重新打开下(关闭IIS界面重新打开)

---------------------------------

如果配置后还是如果访问，然后选中刚刚发布test网站，选中url重写》选中刚才的规则》双击或者点击右侧的“编辑”》和我的进行对比

完整配置

到此你的网站就通过iis发布成功了！

附加一：项目迭代更新

只需要把改动的 pages 下面的文件复制到服务器项目文件里，然后，

第一步：停止pm2

pm2 stop app_name|app_id

假设我的名称是 IISTest1

pm2 stop  IISTest1

第二步：编译

一定要进入当前项目目录

npm run build

第三步：运行

pm2 start IISTest1.js

IISTest1.js就是我上面操作node依赖时，写的JS文件

第四步：保存pm2

执行命令：

pm2 save

附加二：你可能需要了解的

第一项

在下面文章提到的

https://www.cnblogs.com/stealth7/p/7299614.html

nuxt.js源代码如果不想放在服务器上，可以删除除了.nuxt, build, node_modules文件夹和package.json文件的其他文件和文件夹，但是每次发布build和.nuxt两个文件夹和package.json文件需要进行更新，如有依赖包更新，直接运行更新依赖包命令就可以了

另外默认的服务是host在127.0.0.1本机上，在部分服务器上，如云服务器使用虚拟ip的服务器上，localhost和127.0.0.1都可以访问，但是使用内网的ip无法访问，这也直接导致了服务器外网即使端口开启了，也没有办法访问站点，需要更改server/index.js的host配置，去掉host参数