用角度替换文件不起作用

Question

我是 ionic 新手，在我的 ionic 应用程序中，我需要根据环境（dev/prod）切换组件的 HTML 和 ts 文件。

所以我从角度使用 fileReplacements 选项。

 "fileReplacements": [
              {
                "replace": "src/app/vital-entry/vital-entry.page.html",
                "with": "src/app/vital-entry/vital-entry-stJohns.page.html"
              },
              {
                "replace": "src/app/health-condition-entry/health-condition-entry.page.html",
                "with": "src/app/health-condition-entry/health-condition-entry-stJohns.page.html"
              },
              {
                "replace": "src/app/health-condition-entry/health-condition-entry.page.ts",
                "with": "src/app/health-condition-entry/health-condition-entry-stJohns.page.ts"
              },
              {
                "replace": "src/app/submitting-conditions/submitting-conditions.page.ts",
                "with": "src/app/submitting-conditions/submitting-conditions-stJohns.page.ts"
              }
            ]
          },

但是一旦附加文件（如 submit-conditions-stJohns.page.ts、health-condition-entry-stJohns.page.ts、health-condition-entry-stJohns.page .html,vital-entry-stJohns.page.html) 添加到组件中，开发模式工作正常。

ERROR in src/app/health-condition-entry/health-condition-entry-stJohns.page.html:1:1 - error NG8001: 'ion-header' is not a known element:
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 <ion-header>
  ~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:2:3 - error NG8001: 'ion-toolbar' is not a known element:      
1. If 'ion-toolbar' is an Angular component, then verify that it is part of this module.
2. If 'ion-toolbar' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this 
message.

2   <ion-toolbar>
    ~~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:3:5 - error NG8001: 'ion-buttons' is not a known element:      
1. If 'ion-buttons' is an Angular component, then verify that it is part of this module.
2. If 'ion-buttons' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this 
message.

3     <ion-buttons slot="start">
      ~~~~~~~~~~~~~~~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:4:7 - error NG8001: 'ion-menu-button' is not a known element:
1. If 'ion-menu-button' is an Angular component, then verify that it is part of this module.
2. If 'ion-menu-button' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

4       <ion-menu-button></ion-menu-button>
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:6:5 - error NG8001: 'ion-title' is not a known element:        
1. If 'ion-title' is an Angular component, then verify that it is part of this module.
2. If 'ion-title' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

6     <ion-title> Health Condition Entry </ion-title>
      ~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:10:1 - error NG8001: 'ion-content' is not a known element:
1. If 'ion-content' is an Angular component, then verify that it is part of this module.
2. If 'ion-content' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this 
message.

10 <ion-content id="page15">
   ~~~~~~~~~~~~~~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:12:5 - error NG8001: 'ion-row' is not a known element:
1. If 'ion-row' is an Angular component, then verify that it is part of this module.
2. If 'ion-row' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

12     <ion-row class="ubiqrow" style="font-size: 1.5em">
       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.htmlm:13:7 - error NG8001: 'ion-col' is not a known element:        
1. If 'ion-col' is an Angular component, then verify that it is part of this module.
2. If 'ion-col' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

13       <ion-col>
         ~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:14:9 - error NG8001: '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.

14         <ion-label></ion-label>
           ~~~~~~~~~~~~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:16:7 - error NG8001: 'ion-col' is not a known element:
1. If 'ion-col' is an Angular component, then verify that it is part of this module.
2. If 'ion-col' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

16       <ion-col>
         ~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:17:9 - error NG8001: '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.

17         <ion-label></ion-label>
           ~~~~~~~~~~~~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:19:7 - error NG8001: 'ion-col' is not a known element:
1. If 'ion-col' is an Angular component, then verify that it is part of this module.
2. If 'ion-col' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

19       <ion-col>
         ~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:20:9 - error NG8001: '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.

20         <ion-label></ion-label>
           ~~~~~~~~~~~~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:22:7 - error NG8001: 'ion-col' is not a known element:
1. If 'ion-col' is an Angular component, then verify that it is part of this module.
2. If 'ion-col' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

22       <ion-col>
         ~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:23:9 - error NG8001: '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.

23         <ion-label></ion-label>
           ~~~~~~~~~~~~~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:25:7 - error NG8001: 'ion-col' is not a known element:
1. If 'ion-col' is an Angular component, then verify that it is part of this module.
2. If 'ion-col' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

25       <ion-col>
         ~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:26:9 - error NG8001: '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.

26         <ion-label>Mild</ion-label>
           ~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
      m                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:28:7 - error NG8001: 'ion-col' is not a known element:
1. If 'ion-col' is an Angular component, then verify that it is part of this module.
2. If 'ion-col' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

28       <ion-col>
         ~~~~~~~~~
 <ion-col>
         ~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component HealthConditionEntryPage.
src/app/health-condition-entry/health-condition-entry-stJohns.page.html:29:9 - error NG8001: '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.

29         <ion-label>Moderate</ion-label>
           ~~~~~~~~~~~

  src/app/health-condition-entry/health-condition-entry-stJohns.page.ts:15:16
    15   templateUrl: 'health-condition-entry-stJohns.page.html',

我在哪里使用

• 离子 CLI：6.10.1
• Ionic 框架：ionic-angular 3.9.10
• Angular 版本：9.1.12

如何解决这个问题？

提前致谢。

Answer 1

您是否尝试过如下构建软件包

1. ionic cordova build android --prod --release

这应该告诉错误（如果有的话）