Skip to content
This repository has been archived by the owner on Feb 18, 2024. It is now read-only.

Cannot use same babel plugin multiple times #1646

Closed
BenJeau opened this issue Oct 26, 2020 · 2 comments
Closed

Cannot use same babel plugin multiple times #1646

BenJeau opened this issue Oct 26, 2020 · 2 comments

Comments

@BenJeau
Copy link

BenJeau commented Oct 26, 2020

Bug

  • What version of Neutrino are you using?
    • 9.4.0
  • Are you trying to use any presets? If so, which ones, and what versions?
    • @neutrionojs/react v9.4.0
  • Are you using the Yarn client or the npm client? What version?
    • yarn v1.22.4
  • What version of Node.js are you using?
    • node v12.18.3
  • What operating system are you using?
    • Ubuntu (but the code is run inside Docker)
  • What did you do?
  • What did you expect to happen?
    • To apply the plugin more than one time (and to be in the webpack config more than once)
  • What actually happened, contrary to your expectations?
    • Only the last entry from the babel plugins array was applied

Ex: .neutrinorc.js

const react = require("@neutrinojs/react");

module.exports = {
  options: {
    root: __dirname,
  },
  use: [
    react({
      babel: {
        plugins: [
          [
            "import",
            {
              libraryName: "antd",
              libraryDirectory: "es",
              style: true,
            },
            "antd",
          ],
          [
            "import",
            {
              libraryName: "validator",
              libraryDirectory: "es/lib",
              camel2DashComponentName: false,
            },
            "validator",
          ],
        ],
      },
    }),
  ],
};

and the output from neutrino --inspect --mode development (only the relevant babel part):

{
  module: {
    rules: [
      {
        use: [
          {
            options: {
              cacheDirectory: true,
              babelrc: false,
              configFile: false,
              plugins: [
                '/frontend/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
                '/frontend/node_modules/react-hot-loader/babel.js',
                [
                  '/frontend/node_modules/babel-plugin-import/lib/index.js',
                  {
                    libraryName: 'validator',
                    libraryDirectory: 'es/lib',
                    camel2DashComponentName: false
                  }
                ]
              ]
            }
          }
        ]
      }
    ]
  }
}

It seems like its ignoring the third element in the plugins array? How would someone using neutrinojs use the same babel plugin multiple times?

@elpddev
Copy link

elpddev commented Oct 26, 2020

From what it looks like, the react preset uses babelMerge

babel: babelMerge(

babelMerge specifically looks for duplicates in the plugins array
https://github.com/neutrinojs/babel-merge/blob/d24260a025d6416a4cd52e72a8a024f4f403de2f/src/index.js#L13

 return [...source, ...overrides].reduce((reduction, override) => {
    const overrideName = resolve(Array.isArray(override) ? override[0] : override);
    const overrideOptions = Array.isArray(override) ? override[1] : {};
    const base = reduction.find((base) => {
      const baseName = resolve(Array.isArray(base) ? base[0] : base);
      return baseName === overrideName || baseName.includes(overrideName);
    });

    const index = reduction.includes(base) ? reduction.indexOf(base) : reduction.length;
    const baseName = base ? resolve(Array.isArray(base) ? base[0] : base) : overrideName;
    const baseOptions = Array.isArray(base) ? base[1] : {};
    const options = merge(baseOptions, overrideOptions, {
      arrayMerge,
      isMergeableObject: value => Array.isArray(value),
      ...deepmergeOpts
    });

    reduction[index] = Object.keys(options).length ? [baseName, options] : baseName;

It seems there is already an open issue to support the name third parameter in @neutrinojs/babel-merge
neutrinojs/babel-merge#35
Maybe the logic to identify the baseName could be adapted to support the third parameter form

@BenJeau
Copy link
Author

BenJeau commented Oct 26, 2020

Oh sorry, wasn't sure where this originated from. Thanks for the info and quick code explanation! I'll look at potentially making a fix/PR for @neutrinojs/babel-merge if I have time and it's only related to this section

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Development

No branches or pull requests

3 participants