Node.js 网页包：无法分配给只读属性'；出口'；对象的'#&书信电报；对象>'；

当我通过Webpack编译代码时，我在Google Chrome控制台中遇到了以下问题：

Uncaught TypeError:无法分配给对象“#”的只读属性“exports”

Webpack用于捆绑代码的文件：

vendor.js

require（'mdbootstrap-pro/css/mdb.css'）；
要求（'mdbootstrap'）；
要求（'mdbootstrap-pro'）；
require（'jquery'）；
require（'popper.js'）；

与jQuery和Popper一起，

mdbootstrap

中的代码类似于官方的引导版本

webpack.vendor.js

var webpack=require（'webpack'）；
let path=require（'path'）；
让MiniCssExtractPlugin=require（'mini-css-extract-plugin'）；
让TerserJSPlugin=require（'terser-webpack-plugin'）；
让OptimizeCSSAssetsPlugin=require（'optimize-css-assets-webpack-plugin'）；
module.exports=（env={}，argv）=>{
返回{
节点：{
财政司司长：‘空置’，
图表：“空”，
子进程：“空”，
net:'空'，
tls:'空'，
},
条目：{
'供应商'：['./vendor.js']，
},
输出：{
path:path.resolve（uu dirname，'static'，'bundle'），
文件名：“vendor.bundle.js”，
},
模块：{
规则：[
{
测试：/\.css$/,，
使用：[
MiniCssExtractPlugin.loader，
“css加载程序”，
]
},
{
测试：/\（jpg | jpeg | png | woff | woff2 | eot | ttf | svg | gif）$/，
加载器：“url加载器”，
}
],
},
插件：[
新的MinicsSextract插件({
文件名：“vendor.bundle.css”，
}),
新的webpack.ProvidePlugin({
$：“jquery”，
jQuery:'jQuery'，
'window.jQuery'：'jQuery'，
Popper:['Popper.js'，'default']，
})
],
优化：{
minimizer:[新TerserJSPlugin（{}），新OptimizeCSSAssetsPlugin（{}）]，
},
};
};

package.json

{
  "name": "webpack-demo",
  "version": "1.0.0",
  "description": "",
  "private": true,
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
    "url-loader": "^3.0.0",
    "webpack": "^4.41.4",
    "webpack-cli": "^3.3.10"
  },
  "dependencies": {
    "babel-loader": "^8.0.6",
    "bootstrap": "^4.4.1",
    "chart.js": "^2.9.3",
    "css-loader": "^3.4.0",
    "enhanced-resolve": "^4.1.1",
    "file-loader": "^5.0.2",
    "jquery": "^3.4.1",
    "loadash": "^1.0.0",
    "lodash": "^4.17.15",
    "mdbootstrap": "^4.11.0",
    "mdbootstrap-pro": "git+https://oauth2:thequickbrownfoxjumpsoverthelazydog@git.mdbootstrap.com/mdb/jquery/jq-pro.git",
    "mini-css-extract-plugin": "^0.9.0",
    "optimize-css-assets-webpack-plugin": "^5.0.3",
    "popper.js": "^1.16.0",
    "resolve-url-loader": "^3.1.1",
    "sass-loader": "^8.0.0",
    "svg-loader": "0.0.2"
  }
}

事实上，关于这个问题，我在不同的论坛上看到过，他们基本上都提出了这些建议，但没有一个有效：

• 使用

  require

  而不是

  import

  ，因为

  import

  不能与

  模块一起使用。导出

---

• 向配置文件中添加

  sourceType:“明确”

  • 配置对象无效。配置具有未知属性“sourceType”
    

---

非常感谢您的帮助。

sourceType:“毫不含糊”

在根级别的babel配置中出现（我从未使用过popper，不知道它是什么）。而且，是的，不要将导入/导出与require/module混用。导出

sourceType:“毫不含糊”

在根级别的babel配置中出现（我从未使用过popper，不知道它是什么）。而且，是的，不要将导入/导出与require/module.exports混为一谈