javascript - 松露网页包 : Can't resolve 'module' in require-from-string

Question

这发生在编译期间，当 require 调用在 :

错误指向声明它的行:

var Module = require('module');

这是在 require-from-string 的 index.js 中实际上，我可以将该 require 语句放在任何它继续导致错误的地方。

我已经使用 npm 安装了模块，它确实存在于我的 node_modules 中。

我的 webpack.config.js :

const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const webpack = require('webpack')
const standardOptions = require('./package.json').standard

const environment = process.env.NODE_ENV || 'development'
const $ = {}
const modulePattern = /(node_modules|bower_components)/

module.exports = {
  node: {
    fs: 'empty'
  },
  entry: './app/javascript/app.js',
  output: {
    path: path.resolve(__dirname, 'build'),
    filename: 'app.js'
  },
  plugins: [
    // Copy our app's index.html to the build folder.
    new CopyWebpackPlugin([
      { from: './app/index.html', to: "index.html" }
    ])
  ],
  module: {
    rules: [
      {
       test: /\.css$/,
       use: [ 'style-loader', 'css-loader', "postcss-loader" ]
      }
    ],
    loaders: [
      { test: /\.json$/, use: 'json-loader' },
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015'],
          plugins: ['transform-runtime']
        }
      }
    ]
  }
}

Answer 1

我在尝试使用 solc 时遇到了这个问题在浏览器中使用 Next.js .我用 Webpack resolve fallback 解决了它基于 this answer到 require-from-string repository 中的未决问题.

---

这是我做的:

我为 module 添加了一个 resolve fallback 到我的 next.config.js 配置中，所以 Webpack 能够解析一个导入到 'module'，这是导致错误的原因。

module.exports = {
    // more Next.js config ...
    webpack(config, { isServer }) {
        if (isServer) {
            return config;
        }

        return {
            ...config,
            resolve: {
                ...config.resolve,
                fallback: {
                    ...config.resolve?.fallback,
                    module: require.resolve('./src/polyfills/module.js'),
                },
            },
        };
    },
};

如果您不使用 Next.js，我假设 webpack.config.js 看起来像这样:

module.exports = {
  resolve: {
    fallback: {
      module: require.resolve('./src/polyfills/module.js'),
    },
  },
  // more webpack config ...
};

Note that this is a Webpack 5 config, Webpack 4 may be a little different.

polyfill (src/polyfills/module.js) 很简单:

module.exports = module.constructor;

我不知道这是否是 NodeJS module API 的有效 polyfill ，但就我而言，它完成了工作。