【问题标题】:How to deploy Nuxt with IIS如何使用 IIS 部署 Nuxt
【发布时间】:2020-05-11 20:18:22
【问题描述】:

我想在 IIS 中部署 Nuxt,我正在使用 IIS 节点,但我无法让它工作...... Folder

我可以在我的服务器中使用 npm run start 来完成它,但我有其他项目,例如 admin y api (.net),它使用端口 80,所以当我使用端口 80 时它很忙,而在 IIS 中它可以使用这种结构 Folder IIS

这是我在 web.config 中的代码

<?xml version="1.0" encoding="utf-8"?>
<!--
     This configuration file is required if iisnode is used to run node processes behind
     IIS or IIS Express.  For more information, visit:

     https://github.com/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config
-->

<configuration>
  <system.webServer>
    <!-- Visit http://blogs.msdn.com/b/windowsazure/archive/2013/11/14/introduction-to-websockets-on-windows-azure-web-sites.aspx for more information on WebSocket support -->
    <webSocket enabled="false" />
    <handlers>
      <!-- Indicates that the server.js file is a node.js site to be handled by the iisnode module -->
      <add name="iisnode" path="nuxt.config.js" verb="*" modules="iisnode"/>
    </handlers>
    <rewrite>
      <rules>
        <!-- Do not interfere with requests for node-inspector debugging -->
        <rule name="NodeInspector" patternSyntax="ECMAScript" stopProcessing="true">
          <match url="^nuxt.config.js\/debug[\/]?" />
        </rule>

        <!-- <rule name="Redirect to https" stopProcessing="true">
          <match url="(.*)"/>
          <conditions>
            <add input="{HTTPS}" pattern="Off"/>
            <add input="{REQUEST_METHOD}" pattern="^get$|^head$" />
          </conditions>
          <action type="Redirect" url="https://{HTTP_HOST}/{R:1}"/>
        </rule> -->

        <!-- First we consider whether the incoming URL matches a physical file in the /public folder -->
        <rule name="StaticContent">
          <action type="Rewrite" url="public{REQUEST_URI}"/>
        </rule>

        <!-- All other URLs are mapped to the node.js site entry point -->
        <rule name="DynamicContent">
          <conditions>
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="True"/>
          </conditions>
          <action type="Rewrite" url="nuxt.config.js"/>
        </rule>

      </rules>
    </rewrite>

    <!-- 'bin' directory has no special meaning in node.js and apps can be placed in it -->
    <security>
      <requestFiltering>
        <hiddenSegments>
          <remove segment="bin"/>
        </hiddenSegments>
      </requestFiltering>
    </security>

    <!-- Make sure error responses are left untouched -->
    <httpErrors existingResponse="PassThrough" />

    <!--
      You can control how Node is hosted within IIS using the following options:
        * watchedFiles: semi-colon separated list of files that will be watched for changes to restart the server
        * node_env: will be propagated to node as NODE_ENV environment variable
        * debuggingEnabled - controls whether the built-in debugger is enabled

      See https://github.com/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config for a full list of options
    -->
    <!--<iisnode watchedFiles="web.config;*.js"/>-->
  </system.webServer>
</configuration>

在我使用带有 express 的 server.js 之前忽略 nuxt.config.js 但它不起作用,因为我使用的是 ES6,当它尝试运行 nuxt.config 时出现语法错误

【问题讨论】:

    标签: vue.js iis nuxt.js iisnode


    【解决方案1】:

    1) 确保安装节点。

    https://nodejs.org/en/download/

    2) 使用以下命令创建 nutx 应用程序:

    npm init nuxt-app testnu
    

    3)进入app文件夹并运行以下命令构建站点:

    npm run generate
    

    此命令将在您的应用文件夹中生成 dist 文件夹。

    4)在IIS中创建站点,将dist文件夹路径指向站点路径,并分配站点绑定信息。

    5)不要忘记为站点文件夹分配iis_iusrs和iusr权限。(我的例子站点文件夹是testnu)

    6) 更改后刷新并重新启动站点并浏览站点。

    【讨论】:

    • 嗨,谢谢。你知道 npm run build 的方法吗?我有一个 ssr,我使用的是动态路由,所以刷新时出现 404 错误...
    • 您可以尝试运行 npm run build 命令来构建应用程序,但我不确定该命令。您可以为此寻求节点专家的帮助。但在我看来,对于 ssr,你可以使用这个命令 npm run generate。
    【解决方案2】:

    问题是您绝对必须使用 server.js 文件来运行 node.js 服务器。 语法错误可能是在 config.js 中导出时,可以通过将 export default { ... 更改为 module.exports = { ... 轻松修复

    您的 server.js 文件应如下所示:

    const express = require('express');
    const consola = require('consola');
    const { Nuxt, Builder } = require('nuxt');
    const app = express();
    
    const config = require('./nuxt.config.js');
    config.dev = process.env.NODE_ENV !== 'production';
    
    async function start() {
      const nuxt = new Nuxt(config);
      const { host, port } = nuxt.options.server;
    
      if (config.dev) {
        const builder = new Builder(nuxt);
        await builder.build();
      } else {
        await nuxt.ready();
      }
    
      app.use(nuxt.render);
    
      app.listen(port, host);
      consola.ready({
        message: `Server listening on http://${host}:${port}`,
        badge: true
      });
    }
    
    start();
    

    该文件与nuxt.config.js 处于同一级别(请随意将其移动到server/index.js,就像您选择express 作为自定义服务器框架时nuxt-create-app 所做的那样,并将配置导入更改为const config = require('../nuxt.config.js');) .

    并且不要忘记将重写规则和 iisnode 模块的路径更改为 web.config 中的 server.js 文件。

    如果您想在生产模式下运行它,还需要将 &lt;iisnode node_env="development" /&gt; 添加到您的 web.config

    还可以考虑为每个环境添加一个单独的配置文件,然后在package.json 中您可以像这样切换它们:

      "scripts": {
        "dev": "nuxt",
        "build-local": "nuxt build",
        "build-dev": "nuxt build --config-file nuxt.config.dev.js",
        "build": "nuxt build --config-file nuxt.config.prod.js",
        "start": "nuxt start",
        "generate": "nuxt generate"
      }
    

    然后像 npm run build-devyarn build-dev 这样构建。

    【讨论】:

      猜你喜欢
      • 2020-08-02
      • 1970-01-01
      • 2021-07-03
      • 2021-07-15
      • 1970-01-01
      • 2019-06-11
      • 1970-01-01
      • 2021-04-26
      • 1970-01-01
      相关资源
      最近更新 更多