Question

我有一个名为a.js的文件：

a.js：

import { set } from 'lodash';
import { myFunc } from '../helpers';

export default 'hello';

然后我将上述文件（a.js）动态导入b.js中：

const aFile = await import('a.js');

当我打包上面的文件时，出现诸如以下错误：Can't resolve 'fs'，Can't resolve 'cldr'，Can't resolve 'cldr/supplemental'，Can't resolve 'cldr/event'，Can't resolve 'cldr/supplemental'，Can't resolve 'net' ，Can't resolve 'dns'。

但是，当我从import { myFunc } from '../helpers';中删除a.js时，Webpack运行得很好。我肯定路径../helpers存在，并且myFunc是../helpers文件中的命名导出。

为什么当我删除该行时，webpack构建会通过但会失败？

Answer 1

查看helpers.js文件是否正在导入fs，cldr等。尝试将myFunc从helpers.js移至单独的文件，看看是否可以解决问题。

如果仍不能解决问题，请尝试在wepback配置中指定target: 'node'，如下所示：

target: 'node',
node: {
  fs: 'empty',
  net: 'empty',
  ...
  dns: 'empty',
}

target：'node'选项告诉webpack不要触摸任何内置模块，例如fs或net。我不确定为什么，但是添加'empty'字符串似乎也可以解决Can't resolve错误，具体取决于您的配置。

查看本文：https://jlongster.com/Backend-Apps-with-Webpack--Part-I 还有github问题：https://github.com/webpack-contrib/css-loader/issues/447#issuecomment-285600188

我遇到了类似的问题，这似乎有助于我解决问题。 Webpack很棘手。

当文件导入另一个命名的导出文件

1 个答案: