I recently integrated the selectsearchable package into my project and encountered a strange issue. Initially, everything seemed to work fine on the web and even with the ionic cordova build android command. However, when I attempted to compile the project using
ionic cordova build android --prod Please add @Ngmodule Annotation
An error occurred: Unexpected value 'SelectSearchableModule in D:/MdAshiff/Ionic/ionic/node_modules/ionic-select-searchable/source/select-searchable.module.d.ts' imported by the module 'AppModule in D:/MdAshiff/Ionic/ionic/src/app/app.module.ts'. Please add a @NgModule annotation.
app.module.ts
import { NgModule, ErrorHandler } from '@angular/core';
import { IonicApp, IonicModule, IonicErrorHandler, NavController } from 'ionic-angular';
import { Geolocation } from '@ionic-native/geolocation';
import { AppMinimize } from '@ionic-native/app-minimize';
import { OpenNativeSettings } from '@ionic-native/open-native-settings';
import { MyApp } from './app.component';
import { Ionic2RatingModule } from 'ionic2-rating';
import { NativeStorage } from '@ionic-native/native-storage';
import { SplashScreen } from '@ionic-native/splash-screen'
import { CallNumber } from '@ionic-native/call-number';
import { Push, PushObject, PushOptions } from '@ionic-native/push';
import { LocalNotifications } from '@ionic-native/local-notifications';
import { Diagnostic } from '@ionic-native/diagnostic';
import { HomePage } from '../pages/home/home';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule } from '@angular/http';
import { SelectSearchableModule } from 'ionic-select-searchable';
@NgModule({
declarations: [
MyApp,
HomePage
],
imports: [
IonicModule.forRoot(MyApp),
Ionic2RatingModule,
BrowserModule,
HttpModule,
SelectSearchableModule
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
loginPage,
dashboardPage,
ActivitiesPage,
InvoicePage,
feedbackPage,
samplePage,
locationUpdatePage,
scopeofworkPage,
SchedulePage,
waypointPage
],
providers:
[
Geolocation,
NativeStorage,
OpenNativeSettings,
CallNumber,
Push,
LocalNotifications,
Diagnostic,
{
provide: ErrorHandler, useClass: IonicErrorHandler
},
SplashScreen,
AppMinimize ]
})
export class AppModule {}
tsconfig.json
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [
"dom",
"es2015"
],
"module": "es2015",
"moduleResolution": "node",
"sourceMap": true,
"target": "es5"
},
"angularCompilerOptions": {
"skipTemplateCodegen": true,
"skipMetadataEmit": false,
"strictMetadataEmit": true,
"annotationsAs": "decorators"
},
"include": [
"src/**/*.ts"
],
"exclude": [
"node_modules"
],
"compileOnSave": false,
"atom": {
"rewriteTsconfig": false
},
"paths": {
"@angular/*": [
"../node_modules/@angular/*"
]
}
}
package.json
**
{
"name": "Md",
"author": "",
"homepage": "",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve",
"watch": "ionic-app-scripts watch"
},
"dependencies": {
// all the dependencies listed here
},
"devDependencies": {
// all the dev dependencies listed here
},
"description": "Ionic2Blank: An Ionic project",
"cordovaPlugins": [
// cordova plugins
],
"cordovaPlatforms": [],
"-vs-binding": {
// BeforeBuild steps
},
"cordova": {
// cordova configurations
}
}
**
I have looked into various solutions but seem to be missing something. Below are the versions of the key components used:
Ionic 3 Cordova android: 6.3.0 Cordova: 7.1.0
For the rest of the versions, please refer to the package.json file. Any suggestions or solutions?