时间戳

首页 > 解决方案 > Gatsby JS - 生成 SSR 包失败

internet-explorer - Gatsby JS - 生成 SSR 包失败

问题描述

我在让 Gatsby 在 IE11 下以开发模式工作时遇到问题。当我执行npm start 时，出现以下错误：

 ERROR #98123  WEBPACK

Generating SSR bundle failed

.cache\develop-static-entry.js: Unexpected token, expected "," (31:10)

  29 | export default (pagePath, callback) => {
  30 |   let headComponents = [
> 31 |     <meta key="environment" name="note" content="environment=development" />,
     |           ^
  32 |   ]
  33 |   let htmlAttributes = {}
  34 |   let bodyAttributes = {}

File: .cache\develop-static-entry.js:31:10

这就是我的 .babelrc 文件的外观

{
  "plugins": [
    ["@babel/plugin-proposal-decorators", { "legacy": true }],
    ["@babel/plugin-transform-arrow-functions"],
    ["@babel/plugin-transform-object-super"],
    ["@babel/plugin-transform-classes"],
    ["@babel/plugin-transform-react-jsx"],
    ["@babel/plugin-transform-typescript"]
  ],
  "presets": [["babel-preset-gatsby-package"]]
}

这是 gatsby-cli 的版本

"gatsby-cli": "^2.12.99",

我尝试了很多方法，但无法找到解决方案。

标签： internet-explorergatsby

解决方案

这是一个非常广泛的问题，缺乏试验。IE 回退可能因无限原因和代码片段而失败。在尝试为 IE11 调试一些有问题的代码时，请尝试在您的 中添加以下代码段.babelrc：

{
  "plugins": [
    ["@babel/plugin-proposal-decorators", { "legacy": true }],
    ["@babel/plugin-transform-arrow-functions"],
    ["@babel/plugin-transform-object-super"],
    ["@babel/plugin-transform-classes"],
    ["@babel/plugin-transform-react-jsx"],
    ["@babel/plugin-transform-typescript"]
  ],
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "usage",
        "corejs": 2
      }
    ],
    [
      "babel-preset-gatsby",
      {
        "targets": {
          "browsers": [
            ">0.25%",
            "not dead"
          ]
        }
      }
    ]
  ],
}

您似乎缺少 Gatsby 的一些 Babel 预设：

npm通过or安装它们yarn并使用它们。

或者，您可以尝试将以下代码段添加到您的gatsby-node.js：

exports.onCreateWebpackConfig = function onCreateWebpackConfig({ actions, stage, loaders }) {
  if (stage === 'develop') {
    actions.setWebpackConfig({
      module: {
        rules: [
          {
            test: /react-hot-loader/,
            use: [
              loaders.js()
            ]
          }
        ]
      }
    })
  }
}

来源：https ://github.com/gatsbyjs/gatsby/issues/14502 （您可以按照其他解决方法）

推荐阅读