为什么视图不是在 Aurelia 生产构建模式下创建的

Question

我试图在生产模式下构建我的 Aurelia 应用程序 (devMode:production)。构建成功但是当运行打开 index.html 时我得到错误 "Cannot determine default view strategy for object."

应用程序在开发模式下构建它时工作得很好，运行它在本地通过打开 index.html 或执行 "au run"。

该应用程序是由 Aurelia-cli 生成的。我曾尝试关闭 webpack.config.js 中为生产模式设置的所有设置，但没有任何运气。

在我的主应用程序视图模型中，我正在创建一个视图模型数组，这些视图模型将在视图中用于创建子组件：

application.ts

...  
let newBayViewModel = new bay(sectionListLeftBay);
this._bayViewModels.push(newBayViewModel);

newBayViewModel = new bay(sectionListRightBay);
this._bayViewModels.push(newBayViewModel);
...

application.html

<div class="bay" repeat.for="bay of bayViewModels">
  <compose view-model.bind="bay"></compose>
</div>

并且在海湾中 class 我正在创建一组将在海湾视图中界定的剖面视图模型：

bay.ts

export class bay {
  private _sectionViewModels: section[] = [];
  public get sectionViewModels() : section[] {
    return this._sectionViewModels;
  }

  constructor(
    private _sectionList: string[]) {

      this._sectionList.forEach(sectionName => {
        let newSectionViewModel = new section(sectionName);
        this._sectionViewModels.push(newSectionViewModel);
      });
    }
}

bay.html

<template>
  <div class="section-header" repeat.for="section of sectionViewModels">
      <compose view-model.bind="section"></compose>
  </div>
</template>

如果我删除 bay.ts 中创建截面视图模型的代码，将不会出现错误，所以不知何故问题与该部分有关。可能是什么问题？

我正在使用 aurelia-cli 1.0.0-beta.15、webpack 4.31.0、aurelia-webpack-plugin 4.0.0

Answer 1

只要看一下bay.ts中的代码，它看起来像句子

this._sectionList.forEach(...)

应该改为

_sectionList.forEach(...)

希望对您有所帮助。

Answer 2

您遇到的问题是使用 Webpack 的调试和生产构建之间的不同行为。对于您在开发过程中使用的调试构建，所有模块都保持原样，这意味着您的 html 模块可以访问，因此可以正常工作。对于生产构建，各种优化开始，其中之一是模块连接。因此，不再保留模块的来源（或这些模块的路径），因此您无法获得视图模型的来源，因此无法找到您的视图，因为它使用视图模型来源来查找视图 url .

你可以做的是用useView装饰你的视图模型：

@useView(PLATFORM.moduleName('path/to/my-view'))
export class bay {

}

现在 class bay，即使使用模块串联，仍将有关于其视图应位于何处的信息。

为什么视图不是在 Aurelia 生产构建模式下创建的

Why are the views not created in Aurelia production build mode

typescript

webpack

aurelia