生成的 webpack 4 代码中的“/*！没有找到静态导出 */”是什么意思？答案

【问题标题】：What does "/*! no static exports found */" in the generated webpack 4 code mean?生成的 webpack 4 代码中的“/*！没有找到静态导出 */”是什么意思？
【发布时间】：2018-05-01 11:13:54
【问题描述】：

webpack4 通常会生成以注释 /*! no static exports found */ 开头的模块。这是一个警告和/或它实际上意味着什么？

【问题讨论】：

标签： webpack

【解决方案1】：

这是它的票

https://github.com/webpack/webpack/issues/4877

以及代码中的对应行

https://github.com/webpack/webpack/blob/master/lib/FunctionModuleTemplatePlugin.js#L60

基本上不用担心。这只是意味着 webpack 没有找到任何非 CommonJS 或 AMD（动态）的导出。这是完全正常的，并非警告。

【讨论】：

第二个 GH 链接是 404ing
公关链接 -> github.com/webpack/webpack/pull/4918/files

【解决方案2】：

在 CommonJS、AMD 和 node 之前，我们只是在浏览器中有脚本标签，所以你必须做这样的事情

<head>
  <script src="jquery"></script>
  <script src="jqueryPlugin"></script>
</head>

为了让 jqueryPlugin 正常工作，jquery 必须由浏览器导入并提前运行

在这个例子中，jquery 没有静态导出，它是一个全局突变，jqueryPlugin 也是如此，所以如果你将这些与 webpack 捆绑在一起，你会收到相同的消息。没有导出，每个脚本都发生了变异或利用了全局变量（window.$ = function(){} 作为经典示例），其中脚本标签必须专门排序或连接才能正常工作。

CommonJS 模块规范是 Node.js 中用于处理模块的标准。 webpack 利用module.export 来优化依赖项并防止重新捆绑它已经捆绑的块或脚本，为给定的依赖项及其子树分配一个id。利用 babel 和 webpack 等工具，你可以编写现代 JS、commonjs 或任何你喜欢的东西，让它为浏览器和服务器安全地编译，而不必担心浏览器对语法的支持。

如果你有不使用 commonjs 语法的“老派”脚本，你没有公开module.export(s)，你必须指示 webpack 以特定顺序构建这些脚本，否则你可能会冒着插件被客户端之前执行的风险jquery 已定义。在大多数情况下，浏览器自上而下执行代码。那就是你会看到消息的时候：

/*! no static exports found */

TLDR 如果您没有从原始预编译脚本中导出任何内容，您将在 webpack 包中得到一条注释说明

更多详情请阅读：

https://flaviocopes.com/commonjs/
https://webpack.js.org/guides/shimming/
https://webpack.js.org/loaders/script-loader（对于将依赖全局变量的遗留项目迁移到 webpack 非常有用）
https://stackoverflow.com/a/43005332/1426788（另一个涵盖类似主题和策略的 stackoverflow 答案）

【讨论】：