Question

应用程序工作当我运行离子cordova运行android - 设备，但给我错误，当我尝试离子cordova运行android --prod --release

我正在尝试将ng2-qrcode用于我的延迟加载页面

错误：意外的值'QRCodeComponent in D：/qrstore/node_modules/ng2-qrcode/dist/ng2-qrcode.d.ts'由模块'ItemDetailPageModule in d：/qrstore/src/pages/item-detail/item-detail.module.ts'。请添加@ Pipe / @ Directive / @ Component注释。在错误（本机）在syntaxError（D：\ qrstore \ node_modules \ @angular \ compiler \ bundles \ compiler.umd.js：1729：34）在D：\ qrstore \ node_modules \ @angular \ compiler \ bundles \ compiler.umd.js：15625：40 at Array.forEach（native）在CompileMetadataResolver.getNgModuleMetadata（D：\ qrstore \ node_modules \ @angular \ compiler \ bundles \ compiler.umd.js：15607：54） at addNgModule（D：\ qrstore \ node_modules \ @angular \ compiler \ bundles \ compiler.umd.js：24403：58）在D：\ qrstore \ node_modules \ @angular \ compiler \ bundles \ compiler.umd.js：24414：14 at Array.forEach（native） at _createNgModules（D：\ qrstore \ node_modules \ @angular \ compiler \ bundles \ compiler.umd.js：24413：26） at analyzeNgModules（D：\ qrstore \ node_modules \ @angular \ compiler \ bundles \ compiler.umd.js：24288：14）

离子信息

@ionic/cli-utils  : 1.12.0
ionic (Ionic CLI) : 3.12.0

全球套餐：

cordova (Cordova CLI) : 7.0.1

本地包裹：

@ionic/app-scripts : 3.0.0
Cordova Platforms  : android 6.2.3
Ionic Framework    : ionic-angular 3.7.1

系统：

Android SDK Tools : 25.2.3
Node              : v6.9.4
npm               : 3.10.8
OS                : Windows 10

其他：

backend : pro

项目明细模块

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ItemDetailPage } from './item-detail';
import { HttpModule, Http } from '@angular/http';

//native
import { File } from '@ionic-native/file';
import { FilePath } from '@ionic-native/file-path';
import { SQLite } from '@ionic-native/sqlite';

//providers
import { ItemsProvider, LabelsProvider, SQLiteDatabaseProvider } from '../../providers/providers';

//components
import { ItemCreatePage } from '../item-create/item-create';
import { QRCodeComponent } from 'ng2-qrcode'

//directive
import { AbsoluteDragDirective } from '../../directives/absolute-drag/absolute-drag';

@NgModule({
  declarations: [
    ItemDetailPage,
    QRCodeComponent,
    AbsoluteDragDirective
  ],
  imports: [
    IonicPageModule.forChild(ItemDetailPage),
    HttpModule
  ],
  exports: [
    ItemDetailPage
  ],
  entryComponents: []
  ,
  providers:[
    ItemsProvider,
    SQLite,
    SQLiteDatabaseProvider,
     File,
    FilePath
  ]
})
export class ItemDetailPageModule {}

Answer 1

ng2-qrcode不再维护，不适用于角度的AoT编译器（在使用--prod构建应用时使用）。但是在使用AoT编译器的Ionic3 / Angular4 +项目中使用的替代品有所下降：angularx-qrcode。它基于相同的库并提供相同的API。

按如下方式添加：

npm install angularx-qrcode --save

要使用它，请将其导入NgModule：

import { QRCodeModule } from 'angularx-qrcode';

然后将其添加到imports数组：

imports: [
  QRCodeModule
],

Answer 2

我是上面提到的angularx-qrcode的作者。

对于那些来到这里并使用angularx-qrcode-package的人，我为angular5 / 6准备了一个工作角度应用程序，以便更轻松地开始：

https://github.com/Cordobo/angularx-qrcode-sample-app

master-branch：发布angular6时的最新角度 angular5-branch：你猜对了，是为了angular5

HTH

在加载页面中延迟加载第三方组件（离子）

2 个答案: