Как мне использовать опцию babel "useBuiltIns: 'creation "` в комплекте поставщиков? - PullRequest
Новая
       88

Как мне использовать опцию babel "useBuiltIns: 'creation "` в комплекте поставщиков?

0 голосов
/ 19 сентября 2018

Так как мне нужно также поддерживать IE11, мне нужно также перенести node_modules.

Это конфигурация babel, которую я использую на node_modules: 

presets: [
  ['@babel/preset-env', { modules: false, useBuiltIns: 'usage' }],
],

Я использую useBuiltIns опций, потому что он выдавал ошибку Symbol is not defined, полифилл был необходим.

Однако эта конфигурация ломается во время компиляции, предположительно потому, что она добавляет в код немного imports, вот ошибка:

image'">

По сути это не нравится module.exports.Итак, как мне использовать useBuiltIns в комплекте поставщиков?

На данный момент я решил, что всегда требую заполнить вавилон в index.html, однако это не идеально.

1 Ответ

0 голосов
/ 20 сентября 2018

Babel по умолчанию предполагает, что файлы, которые он обрабатывает, являются модулями ES (с использованием import и export).Если вы запускаете Babel для вещей в node_modules (которые, вероятно, являются модулями CommonJS), вам нужно либо сказать Babel обработать все node_modules как сценарии, либо сказать Babel угадать тип, основываясь на наличии import и export.Гадать проще всего, поэтому вы можете добавить 

sourceType: "unambiguous"

, а также сказать Бабелу, чтобы он не запускал преобразование usage для самого core-js с 

  ignore: [
    /\/core-js/,
  ],

, потому что в противном случае usageфактически преобразование будет вставлять ссылки на core-js в сам , вызывая циклы зависимости.

Таким образом, в вашей конфигурации Babel верхнего уровня, вы должны сделать, например, 

{
  ignore: [
    /\/core-js/,
  ],
  sourceType: "unambiguous",
  presets: [
    ['@babel/preset-env', { modules: false, useBuiltIns: 'usage' }],
  ],
}

Если вы хотите быть более конкретным в этом вопросе, вы можете также сделать 

{
  ignore: [
    /\/core-js/,
  ],
  presets: [
    ['@babel/preset-env', { modules: false, useBuiltIns: 'usage' }],
  ],
  overrides: [{
    test: "./node_modules",
    sourceType: "unambiguous",
  }],
}

, чтобы установить флаг только для файлов внутри node_modules, но, вероятно, это не принесет особой выгоды.

Что касается , почему это исправляет эту ошибку, проблема в том, что, если Бабель считает, что что-то является модулем ES, он вставит import операторов.Если вы вставите оператор import в файл, который также использует CommonJS, такие как module.exports, это означает, что файл теперь будет использовать обе системы модулей в одном файле, что является большой проблемой и вызывает ошибки, которые вы видите.

...