我正在尝试为我常用的react组件设置一个存储库,然后我可以将这些组件添加到我的项目中,比如component-kit并重用这些组件,所以类似于
import MyComponent from 'component-kit/MyComponent';目前,我有以下项目结构:
component-kit/
src/
MyComponent/
index.js
index.js
package.json
webpack.config.jsindex.js文件以下列方式导入所有组件:
import('./MyComponent');然后,我使用webpack将每个导入构建成单独的文件,下面是我的配置,按照拆分代码的文档可用的这里
const webpack = require('webpack');
module.exports = {
entry: './src/index.js',
output: {
filename: 'dist.js'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
options: {
presets: ['env', 'es2015', 'stage-0', 'react'],
plugins: ['syntax-dynamic-import']
}
}
}
]
}
};目前,这输出了2个文件,dist.js和0.dist.js,我不知道如何设置它,在文件输出端有组件名称,即MyComponent.js,这样我就可以像上面提到的那样包括它。理想情况下,这些将不包括在他们的构建反应,因为它将始终存在于父组件。
https://stackoverflow.com/questions/43234696
复制相似问题