Externals with my library

[franciscop]

So I've seen trying to use a React library I'm about to launch, Crossroad, with Razzle. It's 1.5kb, vs React Router (+Dom)'s 15kb, and part of how I did it is by publishing it as an ESM module.

However with Razzle I've seen a couple of discussions on this topic, but couldn't make it work either way:

// razzle.config.js
const nodeExternals = require("webpack-node-externals");

module.exports = {
  modify: (config, { target, dev }) => {
    config.externals =
      target === "node"
        ? [
            nodeExternals({
              whitelist: [
                dev ? "webpack/hot/poll?300" : null,
                /\.(eot|woff|woff2|ttf|otf)$/,
                /\.(svg|png|jpg|jpeg|gif|ico)$/,
                /\.(mp4|mp3|ogg|swf|webp)$/,
                /\.(css|scss|sass|sss|less)$/,
                /^crossroad/,        // <= My library name
                /^@bit\/(.*)/
              ].filter(Boolean)
            })
          ]
        : [];
    return config;
  }
};

// Based on https://github.com/jaredpalmer/razzle/issues/842#issuecomment-475722036
// razzle.config.js

module.exports = {
  modify: (config) => {
    delete config.externals;

    return config;
  },
};

Error in both cases:

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /Users/francisco/projects/demo/node_modules/crossroad/index.min.js
require() of ES modules is not supported.
require() of /Users/francisco/projects/demo/node_modules/crossroad/index.min.js from /Users/francisco/projects/demo/build/server.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename index.min.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /Users/francisco/projects/demo/node_modules/crossroad/package.json

The error seems clear, but it's like babel is ignoring the line where it says to include the node_packages library in the transpilation process. I'd be happy to contribute a small "how-to" guide for future devs in a similar situation, but first I'd need to solve this issue for myself. Any idea of what can be wrong here? Here is a repo for repro, clone npm install and npm start will fail as explained above:

https://github.com/franciscop/razzle-crossroad-repro

[fivethreeo]

https://razzlejs.org/docs/customization#transpilation-of-external-modules

[franciscop]

Awesome, thanks! I see I missed that in the other discussions, and that this was already answered :)