What does "/*! no static exports found */" in the generated webpack 4 code mean?

Here is the ticket for it

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

And the corresponding line in the code

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

Basically, don't worry about it. This just means webpack did not find any exports that are not CommonJS or AMD (dynamic). This is totally normal and not a warning.


Before CommonJS, AMD, and node, we just had script tags in a browser, so you'd have to do something like this

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

in order for jqueryPlugin to work properly, jquery had to be be imported by the browser and run prior

in this example, jquery has no static export, its a global mutation, as is jqueryPlugin, so if you were bundling these with webpack you'd receive the same messages. there were no exports, each script either mutated or leveraged globals (window.$ = function(){} as a classic example), where script tags had to be specifically ordered or concatenated to work correctly.

The CommonJS module specification is the standard used in Node.js for working with modules. webpack leverages module.export to optimize dependencies and prevent the rebundling of chunks or scripts it has already bundled, assigning an id to a given dependency and its subtree. leveraging tools like babel and webpack, you can write modern JS, commonjs, or whatever you please, have it compile safely for the browser and server, without worrying about browser support for the syntax.

if you have 'old school' scripts that do not leverage commonjs syntax, where you do not expose module.export(s) you must instruct webpack to build these scripts in a specific order, otherwise you risk the plugin being executed by a client before jquery is defined. for the most part, browsers execute code from the top down. thats when youll see the message:

/*! no static exports found */

TLDR if you aren't exporting anything from your raw pre-compiled scripts, you'll get a comment in the webpack bundle stating as much

for more details please read:

  • https://flaviocopes.com/commonjs/
  • https://webpack.js.org/guides/shimming/
  • https://webpack.js.org/loaders/script-loader (useful for migrating legacy projects that rely on globals to webpack)
  • https://stackoverflow.com/a/43005332/1426788 (another stackoverflow answer covering similar topics and strategies)

Tags:

Webpack

Recent Posts