如何通过 Angular mdule 联合访问共享资源?

Dav*_*ave 5 angular-module angular nrwl-nx angular-module-federation angular14

我正在使用 Angular 14 和模块联合。在我的远程应用程序中,我有这个文件结构

- package.json
- webpack.config.js
+ src
    - settings.json
    + app
        + services
            - app.service.ts
Run Code Online (Sandbox Code Playgroud)

在我的 app.service.ts 文件中,我访问一个静态 JSON 文件,如下所示

@Injectable({
  providedIn: 'root'
})
export class AppService {
    ...
     public init() {
        const request = new XMLHttpRequest();
        request.open('GET', this.configUrl, false);
        request.send(null);
        ...
    }
Run Code Online (Sandbox Code Playgroud)

在我的 webpack.config.js 文件中,我尝试像这样公开我的模块和文件

module.exports = withModuleFederationPlugin({

  name: 'productlist',

  exposes: {
    './Component': './src/app/app.component.ts',
    './dashboard':'./src/app/my-product-list/my-product-list.module.ts'
  },

  shared: {
    '.settings.json': {
      singleton: true,
      eager: true,
      import: './src/settings.json',
      requiredVersion: 'auto',
    },
    ...shareAll({ singleton: true, strictVersion: true, requiredVersion: 'auto' }),
  },

});
Run Code Online (Sandbox Code Playgroud)

问题是,当我通过 shell 应用程序访问遥控器时,无法再找到“settings.json”文件。我如何从我的 shell 中引用它或与它共享它?我的 shell 的 webpack.config.js 文件中有这个

module.exports = withModuleFederationPlugin({

  name: 'shellapp',

  remotes: {
    "productlist": "http://localhost:4204/remoteEntry.js",
    "settings.json": "http://localhost:4202/settings.json",
  },
    ...

  shared: {
    ...shareAll({ singleton: true, strictVersion: true, requiredVersion: 'auto' }),
  },

});
Run Code Online (Sandbox Code Playgroud)