我在 .babelrc 中添加了以下内容:
{
"plugins": [
["import", { libraryName: "antd", style: "css" }] // `style: true` for less
]
}
这是错误:“[..]/.babelrc”中指定的未知插件“导入”
此外,从文档中我不清楚我是否必须为以下内容导入 CSS:
- 每个单独的组件(例如 DatePicker)或
- 如果 antd/dist/antd.css 包含所有内容。
在 1. 的情况下,将 CSS 路径作为示例的一部分会很好。
如果是 2. 我应该把它放在我的 App.js 中的什么地方?
这些是我安装的 babel 包:
"babel-core": "^6.24.0",
"babel-eslint": "^7.2.1",
"babel-loader": "^6.4.1",
"babel-plugin-transform-class-properties": "^6.23.0",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-preset-es2015": "^6.24.0",
"babel-preset-react": "^6.23.0",
"babel-preset-stage-0": "^6.22.0",
这是我的 webpack.config.js:
const webpack = require('webpack');
const path = require('path');
const nodeModulesPath = path.resolve(__dirname, 'node_modules');
const config = {
// Render source-map file for final build
devtool: 'source-map',
// Entrypoint of the app, first JS to load
entry: [
path.join(__dirname, './app/index.js'),
],
output: {
path: path.resolve(__dirname, "build"), // absolute Path of output file
filename: 'bundle.js', // Name of output file
publicPath: '/static'
},
module: {
rules: [
{
test: /\.js$/, // All .js files
exclude: [nodeModulesPath],
use: [
{
loader: "babel-loader",
options: {
presets: [
"es2015",
"stage-0",
"react",
],
plugins: [
"transform-class-properties",
"transform-decorators-legacy"
]
}
}
]
}
]
},
plugins: [
// Define production build to allow React to strip out unnecessary checks
new webpack.DefinePlugin({
'process.env':{
'NODE_ENV': JSON.stringify('development')
}
}),
// Suppress all the "Condition always true" warnings
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},
minimize: true,
}),
],
};
module.exports = config;