代码之家  ›  专栏  ›  技术社区  ›  Deepali Jadhav

如何使用Webpack将resolveExtensions配置应用于公开的组件

  •  0
  • Deepali Jadhav  · 技术社区  · 2 年前

    我用过 resolveExtensions 在webpack配置中,如下所示。

    const commonOpts = {
      isExternalEnv: true,
      outputPath: 'dist/production/www',
      resolveExtensions: ['.js', '.ts', '.json', '.jsx', '.scss']
    }
    

    它对正常组件运行良好。

    正如我在项目中使用模块联合概念一样。所以我公开了如下组件 resolveExtensions 配置不起作用。

    const commonOpts = {
      isExternalEnv: true,
      outputPath: 'dist/production/www',
      resolveExtensions: ['.js', '.ts', '.json', '.jsx', '.scss'],
      module: {
        rules: [
            {
                test: /\.(sa|sc|c)ss$/,
                use: [
                    {
                        loader: 'sass-resources-loader',
                        options: {
                            resources: require('./src/styles/common/index.js'),
                        },
                    },
                ],
            },
        ],
      },
      moduleFederationOpts: {
        name: 'MyApp',
        filename: 'js/my-app-entry.js',
        exposes: {
            './myapp': './src/app.js',
            './myAppBlock': './src/modules/blocks/myBlock.js',
        },
      },
    }
    

    我们如何申请 resolveExtensions 暴露组件的配置?

    1 回复  |  直到 2 年前
        1
  •  0
  •   DungGramer    2 年前

    如果您使用的是Webpack 5。试试这个!

     resolve: {
        extensions: ['*', '.js', '.ts', '.json', '.jsx', '.scss'],
        ...
    }