next.js 页面“/”中出现错误:错误:简化React错误#321;'生产构建期间

lc8prwob  于 2023-01-17  发布在  React
关注(0)|答案(1)|浏览(122)

我试着在firebase函数上运行Next.js,并且之前已经成功部署过。但是,在添加了一个webpack插件(svgr)并做了进一步的定制之后,我在构建时遇到了一个错误。这是在成功编译后发生的,当时Next.js正在自动优化页面。
我的functions文件夹和我的dev文件夹的依赖项是完全相同的,除了functions文件夹有两个额外的(对于firebase)。
经过检查,它似乎认为我有多个React示例。在Dev模式下从我的/App文件夹中运行应用程序工作正常,然而,在Dev模式下从/Functions文件夹中运行应用程序仍然不工作。
Error occurred prerendering page "/": Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
Error occurred prerendering page "/404.html": Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

下一个配置js

module.exports = {
    distDir: "../functions/next",
    webpack(config) {
        config.module.rules.push({
            test: /\.svg$/,
            use: ['@svgr/webpack'],
        });
        return config;
    },
    externals: {
        react: {
            root: 'React',
            commonjs2: 'react',
            commonjs: 'react',
            amd: 'react'
        },
        'react-dom': {
            root: 'ReactDOM',
            commonjs2: 'react-dom',
            commonjs: 'react-dom',
            amd: 'react-dom'
        }
    },

};

app/package.json

  "dependencies": {
    "@material-ui/core": "^4.7.0",
    "@material-ui/icons": "^4.5.1",
    "@svgr/webpack": "^4.3.3",
    "clsx": "^1.0.4",
    "next": "^9.1.4",
    "prop-types": "^15.7.2",
    "react": "^16.12.0",
    "react-dom": "^16.12.0"
  },

functions/package.json

  "engines": {
    "node": "8"
  },
  "dependencies": {
    "firebase-admin": "^8.0.0",
    "firebase-functions": "^3.1.0",
    "@material-ui/core": "^4.7.0",
    "@material-ui/icons": "^4.5.1",
    "clsx": "^1.0.4",
    "next": "^9.1.4",
    "prop-types": "^15.7.2",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "@svgr/webpack": "^4.3.3"
  },
  "devDependencies": {
    "firebase-functions-test": "^0.1.6"
  },
c0vxltue

c0vxltue1#

让我们保持distDir不变,比如说使用.next而不是../functions/.next。在某种程度上,您可以在使用cp .next ../functions/.next构建之后立即复制构建工件。当您调用next({ dev: true, ...otherOptions })或设置NODE_ENV=production以运行firebase serve时,您还需要将dev值更改为true。

相关问题