Angular 基于IsDebugMode的离子交换导入库

我可以使用

IsDebugMode

关闭导入库吗

我可以做：

if（IsDebugMode）{
从“../mocks/SQLiteMock”导入{SQLiteMock，SQLiteObject}；
}
否则{
从'@ionic native/SQLite'导入{SQLite，SQLiteDatabaseConfig，SQLiteObject}；
}

不，很遗憾，您不能有条件地导入库。不过，您可以导入这两个库，在构造函数中注入这两个库，然后有条件地使用（不存在isDebugMode（）），您可以为每种情况使用您喜欢的任何东西

不过，这不是一个很好的解决方案，因为这意味着您将在内存中加载这两个lib，并且由于您将它们注入构造函数中，因此在构建时发生的树生成不会对它们进行操作

---

如果这是做得少，它甚至可能不会有什么不同，虽然（负面）。我建议您在运行时使用开发工具对内存大小进行基准测试，如果有显著的收益超过了更干净方法的手动性质，那么在使用该模拟开发完功能后，只需在导入中替换模拟类。

即使在浏览器上运行应用程序时某些插件可能会工作（当使用

ionic-serve

）时，我喜欢注入插件的模拟版本，以避免控制台中出现警告（或由于找不到cordova.js而引发错误）

我发现最简单的方法是使用工厂，来决定应该注入哪个插件实现。我将向您展示一个使用

键盘

cordova插件的演示，只是为了保持简短，但任何cordova插件都可以这样做（即使它不是Ionic Native的一部分）

在我的

providers

文件夹中，我有一个名为

plugins

的自定义文件夹，在该文件夹中我添加了一个名为

keyboard.provider.ts

的文件。在该文件中，我定义了以下内容：

// Ionic
import { Platform } from 'ionic-angular';

// RxJS
import { Observable } from 'rxjs/Observable';

// Ionic native
import { Keyboard } from '@ionic-native/keyboard';

// Browser implementation
export class BrowserKeyboardProvider extends Keyboard {

    public hideKeyboardAccessoryBar(hide: boolean): void {
        console.log(`[Keyboard Browser]: hideKeyboardAccessoryBar set to ${hide}`);
    }

    public show(): void {
        console.log(`[Keyboard Browser]: show`);
    }

    public close(): void {
        console.log(`[Keyboard Browser]: close`);
    }

    public disableScroll(disable: boolean): void {
        console.log(`[Keyboard Browser]: disableScroll set to ${disable}`);
    }

    public onKeyboardShow(): Observable<any> {
        console.log(`[Keyboard Browser]: onKeyboardShow`);
        return Observable.of(true);
    }

    public onKeyboardHide(): Observable<any> {
        console.log(`[Keyboard Browser]: onKeyboardHide`);
        return Observable.of(true);
    }

}

// Mobile implementation
export class MobileKeyboardProvider extends Keyboard { }

// --------------------------------------------------------
// Keyboard factory
//    parameters: dependencies of the target service
//    returns: instance of the service (for real devices or the browser)
// --------------------------------------------------------
export function keyboardFactory(platform: Platform) {
    return platform.is('cordova') ? new MobileKeyboardProvider() : new BrowserKeyboardProvider();
}

// keyboardProvider: used to import the service in the NgModule declaration
export let keyboardProvider =
    {
        provide: Keyboard,
        useFactory: keyboardFactory,
        deps: [Platform]
    };

keyboardFactory

获取

平台的一个实例，我们使用该实例检查te应用程序是在浏览器中还是在cordova设备中执行。基于此，我们返回浏览器实现，还是移动实现

keyboardProvider
只是告诉angular它应该使用
keyboardFactory
工厂来创建
Keyboard
类的实例，并且工厂依赖于
平台的实例来正常工作

现在唯一要做的事情就是告诉主模块（app.module.ts
文件中的模块）使用我们的自定义提供程序

// Cordova plugins providers
import { keyboardProvider } from '../providers/plugins/keyboard.provider';

@NgModule({
    declarations: [
        MyApp,
        // ...
    ],
    imports: [
        // ...
    ],
    bootstrap: [IonicApp],
    entryComponents: [
        //...
    ],
    providers: [
        // Cordova plugins
        keyboardProvider,  // <-- Use the provider instead of just Keyboard

        // ...
        { provide: ErrorHandler, useClass: IonicErrorHandler }
    ]
})
export class AppModule { }

//Cordova插件提供程序
从“../providers/plugins/keyboard.provider”导入{keyboardProvider}；
@NGD模块({
声明：[
MyApp，
// ...
],
进口：[
// ...
],
引导：[IonicApp]，
入口组件：[
//...
],
供应商：[
//Cordova插件
keyboardProvider，//IsDebugMode
从哪里来？里面有一条关于使用IsDebugMode（）的评论，那条评论是我做的，我从来没有提到过IsDebugMode（），我说的是。那太酷了！我会很感激的！我还没有机会尝试这个，但我会尝试的。谢谢！我会在尝试后留下更多反馈。听起来很棒：）
// Cordova plugins providers
import { keyboardProvider } from '../providers/plugins/keyboard.provider';

@NgModule({
    declarations: [
        MyApp,
        // ...
    ],
    imports: [
        // ...
    ],
    bootstrap: [IonicApp],
    entryComponents: [
        //...
    ],
    providers: [
        // Cordova plugins
        keyboardProvider,  // <-- Use the provider instead of just Keyboard

        // ...
        { provide: ErrorHandler, useClass: IonicErrorHandler }
    ]
})
export class AppModule { }