与来自外部源的Webpack捆绑会显示“目标环境不支持动态导入()”

de90aj5v  于 2024-01-08  发布在  Webpack
关注(0)|答案(1)|浏览(321)

我想创建一个简单的bundle,其中包含一些来自外部源的JS和一些来自本地源的JS文件。
它在提供外部资源时失败。

  1. const path = require('path');
  2. module.exports = {
  3. mode: 'production',
  4. entry: [
  5. 'https://unpkg.com/[email protected]/src/jquery.csv.min.js',
  6. ],
  7. output: {
  8. path: path.resolve(__dirname, 'dist'),
  9. filename: 'bundle.js',
  10. },
  11. };

字符串
误差

  1. Error: The target environment doesn't support dynamic import() syntax so it's not possible to use external type 'module' within a script
  2. at ExternalModule._getSourceData (/home/../development/widgets/node_modules/webpack/lib/ExternalModule.js:595:13)


它的工作原理时,第一次下载外部源的文件内容,并通过它作为本地文件。

  1. const path = require('path');
  2. module.exports = {
  3. mode: 'production',
  4. entry: [
  5. // 'https://unpkg.com/[email protected]/src/jquery.csv.min.js',
  6. './jquery.csv.min.js',
  7. ],
  8. output: {
  9. path: path.resolve(__dirname, 'dist'),
  10. filename: 'bundle.js',
  11. },
  12. };

  • 我不知道target enrivonment是什么意思。我的机器?
  • node_modules/webpack/lib/ExternalModule.js:595错误是由于runtimeTemplate.supportsDynamicImport()。我不能简单地安装一个软件包,然后沉默显然失踪的import()
  • 我没有显式地执行任何import()。源代码不包含任何import()
  • 我不知道错误中的external type 'module'是什么意思

它与远程与本地有关,因为条目中的代码相同。
https://unpkg.com/[email protected]/src/jquery.csv.min.js的响应没有重定向application/javascript;
有什么想法吗?

7gcisfzg

7gcisfzg1#

我目前的解决方案是,首先用npm下载外部源代码。
package.json

  1. {
  2. "devDependencies": {
  3. "jquery-csv": "^1.0.21"
  4. }
  5. }

字符串
webpack.config.js

  1. const path = require('path');
  2. module.exports = {
  3. mode: 'production',
  4. entry: './entry.js',
  5. output: {
  6. path: path.resolve(__dirname, 'dist'),
  7. filename: 'MyBundle.js',
  8. }
  9. }


entry.js

  1. import csv from 'jquery-csv';
  2. import MyWidget from './../MyWidget';
  3. window.myWidget = new MyWidget(csv)

展开查看全部

相关问题