Транспортировать Array.prototype.flat с помощью @babel? - PullRequest
Новая
       15

Транспортировать Array.prototype.flat с помощью @babel?

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

Я случайно ввел проблему обратной совместимости в свое приложение React с помощью Array.prototype.flat. Я был очень удивлен, что это не было решено путем переноса - я думал, что это приведет к ES2015-совместимому коду.

Как я могу заставить Вавилон 7 это перенести? (Если мое чтение источников верно в Вавилоне 6, для этого все еще был плагин, но так как он начал распространяться на браузеры, поддержка была прекращена?)

Инструменты:

  • @ столпотворение / ядро ​​@ 7.0.0
  • webpack@4.18.0

Мои файлы конфигурации верхнего уровня выглядят так:

webpack.config.js 

var path = require('path')

module.exports = {
  entry: "./src/index.js",
  output: {
      path: path.join(__dirname, 'dist', 'assets'),
      filename: "bundle.js",
      sourceMapFilename: "bundle.map"
  },
  devtool: '#source-map',
  module: {
      rules: [
          {
              test: /\.js$/,
              exclude: /(node_modules)/,
              loader: 'babel-loader'
          }
      ]
  }}

.babelrc 

{
  "presets": [ "@babel/preset-env", "@babel/react" ],
  "plugins": [["@babel/plugin-proposal-pipeline-operator", { "proposal": "minimal" }]]
}

.browserslistrc 

chrome 58
ie 11

1 Ответ

0 голосов
/ 29 марта 2019

Вот важное замечание: вы не можете «убрать это». Вы можете только заполнить это.

Для этого вы можете использовать

  • core-js @ 3 установлена ​​как зависимость времени выполнения
  • конфигурация @ babel / preset-env для использования useBuiltIns: использование, при необходимости импортируются необходимые полизаполнения вместо ручного импорта @ babel / polyfill в исходный код

Весь .babelrc настроен так 

  "presets": [                                                                                                                                               
    [                                                                                                                                                        
      "@babel/preset-env",                                                                                                                                   
      {                                                                                                                                                      
        "targets": {                                                                                                                                         
          "node": 4                                                                                                                                          
        },                                                                                                                                                   
        "useBuiltIns": "usage",                                                                                                                              
        "corejs": 3                                                                                                                                          
      }                                                                                                                                                      
    ]                                                                                                                                                        
  ]                                                                                                                                                          
}

В качестве альтернативы вы можете использовать @ babel / polyfill в качестве зависимости времени выполнения в вашем package.json и import "@babel/polyfill" в своем коде.

Все детали, которые вам нужны, находятся на этой странице https://babeljs.io/docs/en/babel-polyfill, но есть много тонкостей

Я создал этот минимальный пример, чтобы продемонстрировать

https://github.com/cmdcolin/babel-array-flat-demo

После компиляции вы добавляете правильный импорт в ваш файл https://github.com/cmdcolin/babel-array-flat-demo/blob/master/dist/index.js, и это работает со старыми версиями узла.

...