В моем проекте реагирования webpack.config.js вводит такие свойства класса предложения:
...
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
query: {
presets: ['@babel/react', '@babel/preset-env'],
plugins: ['@babel/proposal-class-properties']
}
},
}
...
Включив @babel/proposal-class-properties, я могу удалить конструкторы из своих компонентов React и т. д.
Однако документация показывает plugin-proposal-class-properties в .babelrc следующим образом (и вообще не упоминает webpack.config.js):
{
"plugins": ["@babel/plugin-proposal-class-properties"]
}
тогда как мой .babelrc вообще не включает никаких плагинов:
{
"presets": [
["@babel/env", {
"modules": false
},
"@babel/preset-env"]
]
}
Есть ли какая-то эффективная разница между включением плагинов (таких как proposal-class-properties) в webpack.config.js и добавлением их в .babelrc?





Вы можете настроить babel через .babelrc или через конфигурацию babel-loader в webpack. Они оба работают одинаково.
Однако я рекомендую использовать только .babelrc для настройки babel.
Таким образом, он также может работать, когда вы запускаете свои тесты, которые обычно не проходят через веб-пакет и, следовательно, не будут иметь конфигурацию веб-пакета для Babel.
.babelrc:
{
"presets": ["@babel/preset-env"]
"plugins": ['@babel/plugin-proposal-class-properties', {'loose': true}]
}
Нет. Все, что вы определяете в webpack под
useдля babel, сочетается с вашей конфигурациейbabelrc. Я предпочитаю использоватьbabelrcдля конфигурации.