Использование Babel в собственном пакете npm правильным способом - PullRequest
Новая
       1

Использование Babel в собственном пакете npm правильным способом

1 голос
/ 08 января 2020

У меня есть свой собственный пакет npm, использующий ES6. Таким образом, есть Babel как зависимость от dev, а в коде есть import "@babel/polyfill"

Пакет используется в моем проекте также с использованием ES6, снова используя Babel как зависимость от dev и вызывая import "@babel/polyfill";.
И я получаю @ babel / polyfill загружается на этой странице более одного раза.

Как правильно обращаться с Бабелем в библиотеке и в проекте? Чтобы Babel был импортирован в библиотеку и в самом проекте, он должен иметь только зависимость dev, но не импортировать ее?

Спасибо

1 Ответ

1 голос
/ 08 января 2020

Это известная проблема для пакета @babel/polyfill, и о github

сообщается о множественной проблеме * Одним из решений является использование idempotent-babel-polyfill

Другим решением является удаление babel-polyfill из вашего entry в файле конфигурации webpack и использование babel-preset-env для включения полифилов из babel-polyfill с использованием useBuiltIns : опция «использования», поэтому ваш файл конфигурации webpack выглядит так: 

{
  entry: {
    'file1': ['babel-polyfill', './src/file1.js'],
    'file2': ['babel-polyfill', './src/file2.js'],
    // ...
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules)/,
        loader: 'babel-loader',
        options: {
          presets: [
            ['@babel/preset-env', {
              targets: {
                browsers: ['last 2 versions', 'ie >= 11']
              },
              modules: false
            }]
          ]
        }
      }
    ]
  },
  // ...
}

становится 

{
  entry: {
    'file1': './src/file1.js',
    'file2': './src/file2.js',
    // ...
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules)/,
        loader: 'babel-loader',
        options: {
          presets: [
            ['@babel/preset-env', {
              targets: {
                browsers: ['last 2 versions', 'ie >= 11']
              },
              modules: false,
              useBuiltIns: 'usage'
            }]
          ]
        }
      }
    ]
  },
  // ...
}
...