@ babel / plugin-transform-runtime для реактивного проекта - PullRequest
Новая
       33

@ babel / plugin-transform-runtime для реактивного проекта

0 голосов
/ 04 февраля 2020

Я хотел бы заставить приложение реагировать с @babel/plugin-transform-runtime для поддержки IE9. Если я использую core-js, @babel/polyfill, это приведет к загрязнению глобальной области. На самом деле другая внешняя библиотека (core- js определена) конфликтует с моим приложением. К сожалению, я должен включить внешнюю библиотеку (shCore. js)

. Вот почему я хочу использовать @babel/plugin-transform-runtime Так что я должен сделать, чтобы приложение реагировать на IE9 с @ babel / plugin-transform-runtime

// пакет. json

{
"devDependencies": {
"@babel/core": "^7.8.3",
"@babel/plugin-proposal-class-properties": "^7.8.3",
"@babel/plugin-transform-runtime": "^7.8.3",
"@babel/preset-env": "^7.8.3",
"@babel/preset-react": "^7.8.3",
"@babel/runtime-corejs3": "^7.8.3",
"babel-loader": "^8.0.6",
"css-loader": "^3.2.1",
"html-webpack-plugin": "^3.2.0",
"style-loader": "^1.0.1",
"url-loader": "^3.0.0",
"webpack": "^4.41.5",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.10.2"
},
"dependencies": {
"@babel/runtime": "^7.8.3",
"axios": "^0.19.0",
"core-js": "^3.6.1",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-icons": "^3.8.0",
"react-redux": "^7.1.3",
"react-router-dom": "^5.1.2",
"redux": "^4.0.4",
"redux-actions": "^2.6.5",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.3.0"
}
}

// webpa c .config. js

module: {
rules: [
  {
    test: /\.(js)$/,
    exclude: {
      test: path.resolve(__dirname, "node_modules"),
      exclude: [
        path.resolve(__dirname, "node_modules/react-dom"),  // <- something like this!!
      ]
    },
    loader: 'babel-loader',
    options: {
      presets: [
        ['@babel/preset-env', {'targets': {'browsers': ["ie > 8"]}}],
        ['@babel/preset-react', {'targets': {'browsers': ["ie > 8"]}}]
      ],
      plugins: [
        [
          "@babel/plugin-transform-runtime", {
          "absoluteRuntime": false,
          "corejs": false,            
          "helpers": true,                                  
          "regenerator": true,                         
          "useESModules": true,                             
        }],
        ["@babel/plugin-proposal-class-properties", {loose: true}]
      ],
    },
  }
]

},

1 Ответ

0 голосов
/ 04 февраля 2020

Если вы напрямую импортируете core- js или @ babel / polyfill и предоставляемые им встроенные модули, такие как Promise, Set и Map, они будут загрязнять глобальный охват. Хотя это может быть приемлемо для приложения или инструмента командной строки, это становится проблемой, если ваш код является библиотекой, которую вы намереваетесь опубликовать sh для использования другими, или если вы не можете точно контролировать среду, в которой ваш код будет работать.

Преобразователь будет связывать эти встроенные модули с ядром- js, так что вы можете использовать их без проблем, не требуя поли-заполнения.

Ссылка с здесь

...