WebPack：导入module.exports在同一模块造成的错误

Question

我正在开发一个带有webpack的网站。当我有这样的代码时：

import $ from 'jquery';
function foo() {};
module.exports = foo;

我收到错误uncaughttypeerror:无法分配给对象的只读属性“exports”#

事实证明，将导入$从'jQuery'更改为var$=需要（'jQuery'）不会导致任何错误。

为什么module.exports导入会导致此错误？使用要求代替有什么问题吗？

Answer 1

可以在导出时使用要求。但不是进口和module.exports.

Answer 2

如果下游的其他模块具有意外的require树，则会发生这种情况。Babel变更需要导入不应该导入的内容，这导致了上述问题@Matthew Herbst。要解决此问题，请向您的babelrc文件或babel.config.js添加“sourceType”：“毫不含糊”，这样@babel/plugin transform runtime就不会对需要导入到commonjs文件中的表达式进行此更改。如：

module.exports = {
  presets: [
    '@quasar/babel-preset-app'
  ],

  "sourceType": "unambiguous"
}

Answer 3

你不能混合导入和module.exports。在导入世界中，你需要导出东西。

// Change this
module.exports = foo;

// To this
export default foo;