构建 nextjs 应用程序时未定义定义

Question

我正在使用下一个版本 10.0.1，并响应 17.0.2，

当我尝试构建我的下一个应用程序时，出现错误：

ReferenceError: define is not defined
    at Object.<anonymous> (/Users/***/Desktop/gm/toesim-web/node_modules/@glonassmobile/codebase-web/createAction.js:1:1)
    at Module._compile (node:internal/modules/cjs/loader:1092:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1121:10)
    at Module.load (node:internal/modules/cjs/loader:972:32)
    at Function.Module._load (node:internal/modules/cjs/loader:813:14)
    at Module.require (node:internal/modules/cjs/loader:996:19)
    at require (node:internal/modules/cjs/helpers:92:18)
    at Object.i1ag (/Users//Desktop/gm/toesim-web/.next/server/pages/deeplink/payment/[paymentId].js:7425:18)
    at __webpack_require__ (/Users/Desktop/gm/toesim-web/.next/server/pages/deeplink/payment/[paymentId].js:23:31)
    at Object.S/7G (/Users/Desktop/gm/toesim-web/.next/server/pages/deeplink/payment/[paymentId].js:5128:21) {
  type: 'ReferenceError'
}

这是node_modules发生错误的代码

define(["require", "exports"], function (require, exports) {
    "use strict";
    exports.__esModule = true;
    exports.createAction = void 0;
    var createAction = function (type, payload) { return ({ type: type, payload: payload }); };
    exports.createAction = createAction;
});
//# sourceMappingURL=createAction.js.map

我尝试添加到我的 next.config 文件

require('amd-loader') 但它也不起作用

我找了大约一个星期的答案，但都没用有人可以帮忙吗？

PS next.config.js

const path = require('path');
const withCSS = require('@zeit/next-css');
const withSass = require('@zeit/next-sass');
const webpack = require('webpack');
const ES6Promise = require("es6-promise");
ES6Promise.polyfill();

if (typeof define !== 'function') {
    var define = require('amdefine')(module); // this doesn't work too
}

module.exports = withCSS(withSass({
    webpack: function (config, options) {
        config.plugins.push(new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            Promise: 'es6-promise-promise',
        }))
        config.module.rules.push(
            {
                test: /.(js|jsx|tsx|ts)$/,
                exclude: /node_modules/,
                include: path.resolve('./client/pages/'),
                use: {
                    loader: "ts-loader",
                    options: {
                        configFile: './src/client/app/tsc.json',
                    },
                },
            },
            {
                test: /\.(eot|woff|woff2|ttf|svg|png|jpg|gif)$/,
                use:{
                    loader: 'url-loader',
                    options: {
                        name: '[name].[ext]',
                        limit: 10000000,
                        esModule : false,
                    }
                }
            },
        )
        return config
    }
}))

和 tsconfig

  "compilerOptions": {
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true,
    "target": "ES6",
    "moduleResolution": "Node",
    "sourceMap": true,
    "module": "commonjs",
    "jsx": "preserve",
    "allowJs": true,
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "skipLibCheck": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noEmit": false,
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "baseUrl": "./src/client/",
    "isolatedModules": true
  },
  "files": [
    "./src/pages/index.tsx"
  ],
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
  ],
  "exclude": [
    "src/**/*.proto",
    "node_modules"
  ]
}```

Answer 1

可能您正在尝试在需要浏览器环境的服务器上导入一些库

从错误追踪其 /node_modules/@glonassmobile/codebase-web/createAction.js:1:1

如果你决定使用这个库，你需要像const isServer = typeof window === 'undefined'一样检查你是服务器端还是客户端，只有当你是客户端时才导入库

构建 nextjs 应用程序时未定义定义

define is not defined while build nextjs app

amd

defined

typescript

reactjs

next.js