Question

在我的Angular混合应用程序引导期间（Angular7和AngularJS并排工作）。我想使用来自单独的config json文件的配置作为窗口变量。目前，我正在使用：

setAngularLib(AngularJs);
platformBrowserDynamic().bootstrapModule(CatalogModule).then(platformRef => {
  const config = require('./config.json');
  (<any>window).__APP_CONFIG__ = config;

  const appMountPoint = document.querySelector('[xs-app-mountpoint]');
  const upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule;
  upgrade.bootstrap(appMountPoint, [Ng1Module], {strictDi: false});

  console.log('hybrid app bootstrapped');
})
  .catch(err => console.log(err));

但是，目前Webpack正在将整个config.json文件内容放入编译后的一个main.js文件中，这是我不想要的。我想获取配置文件并将其用作Window变量，但要将config.json文件与main.js分开。

这怎么可能？我尝试使用

const config = JSON.parse(fs.readFileSync('./config.json', 'utf8'));

但这没用。

Answer 1

我设法使用Fetch API找到解决方案：

fetch('config.json')
  .then(response => response.json())
  .then((config) => {
    platformBrowserDynamic().bootstrapModule(CatalogModule).then(platformRef => {
      (<any>window).__APP_CONFIG__ = config;
      const appMountPoint = document.querySelector('[xs-app-mountpoint]');
      const upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule;
      upgrade.bootstrap(appMountPoint, [Ng1Module], {strictDi: false});

      console.log('hybrid app bootstrapped');
    }).catch(err => console.log(err));
  });

如何将JSON文件用作JS对象而不将其导入到Webpack编译代码中？

1 个答案: