loading an asset defined in a css file fails about coexisting-angular-microfrontends HOT 4 CLOSED

Hmm publicPath set on MiniCssExtractPlugin.loader should do the trick. I don't know why it isn't working for you

from coexisting-angular-microfrontends.

Yes, it is possible. I believe all that is needed is to use --deploy-url when doing ng build. See https://github.com/AMPATH/ng2-amrs/tree/single-spa which is an example that has font-awesome loading properly.

from coexisting-angular-microfrontends.

Hi Joel,

Thanks for your response. I should have mentoined we are using Angular8 with the new recommended webpackbuilder. Your example seems to be for Anular6.

I think I can solve this issue by defining additional rules in the extra-webpack.config.js file but I'm not experienced with webpack.

What I tried now is this, but without luck. Any idea what I am doing wrong? I would like to prepend "/navigation/" in the url('') statements in my CSS files.

const singleSpaAngularWebpack = require('single-spa-angular/lib/webpack').default
const MiniCssExtractPlugin  = require('mini-css-extract-plugin');

module.exports = (angularWebpackConfig, options) => {
  const singleSpaWebpackConfig = singleSpaAngularWebpack(angularWebpackConfig, options)

  singleSpaAngularWebpack.module = {
      rules : [
      {
        test: /\.scss$/,
        use: [
          {
            loader: MiniCssExtractPlugin.loader,
            options: {
              publicPath: '/navigation/'
            }
          },
          {loader: 'css-loader'},
          {loader: 'sass-loader'}
        ]
      }
    ]
  };


  // Feel free to modify this webpack config however you'd like to
  return singleSpaWebpackConfig;
}

from coexisting-angular-microfrontends.

Closing because of inactivity.

from coexisting-angular-microfrontends.