如何在 Ionic 5 中构建网络

Question

我正在尝试使用Ionic 5构建Web应用程序 我试过：

ionic cordova build browser --prod --release

和

ionic serve --prod

两者都失败并出现错误，例如：

1. If 'ion-header' is an Angular component, then verify that it is part of this module.
2. If 'ion-header' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
1. If 'ion-icon' is an Angular component, then verify that it is part of this module.
2. If 'ion-icon' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the'@NgModule.schemas' of this component to suppress this message.
'ion-label' is 
not a known element:
1. If 'ion-label' is an Angular component, then verify that it is part of this module.
2. If 'ion-label' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

似乎在建筑生产时，它不会再生离子成分。

当我使用以下命令时，我很好：

ionic serve

那么如何处理呢？ 谢谢

Answer 1

为 web 构建离子代码的命令ionic build。

如果要为生产构建代码，请使用 -ionic build --prod。

这是将所有Ionic代码构建到www文件夹中，您可以使用它与nginx或任何其他Web服务器一起使用。

Answer 2

对于将来来到这里的人来说，一个很大的区别

ionic build

与

ionic build --prod

是编译器将更详细地验证代码。

我曾经在上一个 Ionic 应用程序上遇到过这些问题，以至于我从未使用生产标志进行构建，因为我不理解。

现在有了我的新Ionic应用程序，我意识到问题出在我的代码上。

在上述问题的情况下，我会说开发人员缺少一些应该导入到NgModule中的依赖项。特别是如果他们使用延迟加载，他们可能会错过该特定页面模块上的导入。

例如，在 Ionic 5/6 上，pageName.module.ts 文件必须包含 IonicModule，如以下示例所示：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { IonicModule } from '@ionic/angular';
import { PageNameRoutingModule } from './pageName-routing.module';
import { PageName } from './pageName.page';
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
PageNameRoutingModule
],
declarations: [PageName]
})
export class PageNameRoutingModule {}

避免这种情况的最佳方法是在创建新页面时使用以下 CLI 命令：

ionic generate page pageName

还有另一种情况，当所有导入都正确时，您可能会遇到此类错误。如果您尝试错误地使用离子组分，则可能会发生这种情况。例如，如果您正在使用不存在的组件，或者您正在尝试附加某种与该离子组件不兼容的功能。这些错误通常会在没有生产标志的情况下显示在构建中，但可能不会。

请始终参考 https://ionicframework.com/docs/components 以正确使用离子组件。