webpack+按需引入打包异常

[CNFeffery]

在使用webpack打包按需引入了pro-editor中组件的项目时，会出现一大堆与引入组件无关的其他模块的错误信息，请问在使用webpack打包pro-editor时有什么需要注意的吗：

[ONLY-yours]

看起来，如果使用 webpack 去打包需要配置一些东西，我看看能在我这边打包的时候配置下

[ONLY-yours]

@CNFeffery 你可以参考这个 issue 改一下么？https://github.com/pmndrs/valtio/issues/196 我看他们是类似的报错，加了一个 rules 规则可以先暂时改改试试呢？

[CNFeffery]

@ONLY-yours 我添加相关规则后，确实少了很多 先前的错误信息，但是还是有很多其他的报错信息：

[ONLY-yours]

@CNFeffery 试试这个：

我发现有人在尝试用 webpack 去编译带有 reactflow 依赖的时候，他们也有类似的错误，原因就在 loader 上，我找了官网，但是没有发现他们有说这个问题。一些三方的讨论是有的 https://github.com/xyflow/xyflow/issues/2652#issuecomment-1462207989 有很多人分享了他们的配置，但是我不确定对你是否有用

{
    test: /\.js$/,
    include: [
        path.resolve(__dirname, 'src'),
        /node_modules[\/]@?reactflow/
    ],
    use: {
        loader: 'babel-loader',
        options: {
            presets: [['@babel/preset-env', { 'modules': false }], '@babel/preset-react'],
            plugins: [ "@babel/plugin-proposal-class-properties" ]
        },
    },
}

[CNFeffery]

@ONLY-yours 我查看了一下错误信息，发现涉及的模块不止reactflow，还有leva、shikiji，关键是我只引入使用了DraggablePanel，不知道为什么会牵扯到这些库😭

[ONLY-yours]

@ONLY-yours 我查看了一下错误信息，发现涉及的模块不止reactflow，还有leva、shikiji，关键是我只引入使用了DraggablePanel，不知道为什么会牵扯到这些库😭

对不起，我们在做的时候没有考虑到直接用 webpack 打包的场景 😭 我们测试了在 umijs、dumi 等一些框架下打包都是可以的，这些框架对于很多配置都是写好了的，但是直接使用 webpack 的确实没考虑到

依赖多是因为本身组件库非常的重，加了很多库来支持不同场景的内容。

[CNFeffery]

@ONLY-yours 那umi可以导出原始的webpack.config.js吗 如果umi可以正确打包的话 想看看umi具体怎么处理的

[ONLY-yours]

@ONLY-yours 那umi可以导出原始的webpack.config.js吗 如果umi可以正确打包的话 想看看umi具体怎么处理的

感觉应该是可以的，我在 nextjs 里面测试了打包也没什么问题