Posted in Uncategorized

hyphenated names

   February 23, 2021  3 Comments on hyphenated names

Do you want to request a feature or report a bug? bug

What is the current behavior?
When setting any dependency with hyphenated name such as html-minifier or react-dom to external, the build is produced with the line (example)
module.exports = react-dom
where react-dom is not a valid javascript identifier, but is interpreted as the - operator being applied to two identifiers.

If the current behavior is a bug, please provide the steps to reproduce.
Follow the steps in #4237, except for adding the line , externals: 'html-minifier under , target: 'node' in webpack.config.js

What is the expected behavior? Some other kind of reference should be made to the externalized module, so that the build works.

If this is a feature request, what is motivation or use case for changing the behavior?

Please mention other relevant information such as the browser version, Node.js version, webpack version and Operating System. Again, see #4237

Author: Fantashit

3 thoughts on “hyphenated names”

  1. can you give an example code?

    the one mentioned in #4237 does not contain any external definition

    but from what you write you have something like this:

    ...
externals: {
  'html-minifier': 'html-minifier'
}

    which tells webpack to look for a global variable called html-minifier if you require html-minifier which as you mention makes no sense as it is not even a valid variable name. (But kind of not webpacks problem, as you tell it to look for that).

    what may be more interesting for you is probably something as described here: https://webpack.js.org/configuration/externals/#function

    so you can say

    ...
externals: {
  'html-minifier': 'commonjs html-minifier'
}

    to tell webpack to load html-minifier as a common.js rather than a global variable.

    (did not test the code so use at your own risk).

  2. please try what I posted:

    externals: {
  'html-minifier': 'commonjs html-minifier'
}

    i just checked what i proposed and it works perfectly fine.

    I guess the documentation is not clear enough at this point. Feel free to update it! 🙂

  3. I don’t know if the doc is unclear or if I don’t understand it correctly but using

    externals: {'hyphen-separated': {commonjs: 'hyphen-separated'}}

    results in module.exports = undefined in the bundle which of course does not work, like stated above.

    The solution you provided works (thank you!) but is not documented (or that’s the point I’m missing).
    I’m using webpack@4.5.0 (and webpack-cli@2.0.14).

Comments are closed.