我如何使用 webpack 在 npm 包子文件夹中导入模块？

Question

假设 node_modules 中有一个名为 foo 的包，我想通过 webpack & babel 在库中导入一个模块，例如 foo/module...

import Foo from 'foo'; 有效

import SomeOtherModule from 'foo/module'; 失败并显示以下内容：

Module not found: Error: Cannot resolve module 'foo/module' in /Users/x/Desktop/someproject/js

这使得 webpack 似乎在错误的位置而不是 node_modules

中查找文件

我的 webpack.config 看起来像这样：

var webpack = require('webpack');
var path = require('path');

module.exports = {
    entry: ['babel-polyfill','./js/script.js'],
    output: {
        path: __dirname,
        filename: './build/script.js'
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                loader: 'babel',
                query: {
                    cacheDirectory: true,
                    presets: ['es2015']
                }
            }
        ],
    },
    plugins: [
        new webpack.NoErrorsPlugin()
    ],
    stats: {
        colors: true
    },
    devtool: 'source-map'

};

Answer 1

它应该适用于 import 'foo/module';。它将解析文件 ./node_modules/foo/module.js 或 ./node_modules/foo/module/index.js 和 而不是 类似 ./node_modules/foo/node_modules/module/index.js 的文件（如果它期望的话）（在这种情况下，您最好通过 npm 安装模块）。

Answer 2

您可以使用 package.json 中的 module 属性定义自定义路径。示例：

{
  ...
  "module": "dist/mylib.min.js",
  ...
}

见

我如何使用 webpack 在 npm 包子文件夹中导入模块？

How would I import a module within an npm package subfolder with webpack?

npm

webpack

babeljs