JsDaddy / ngx-mask

Angular Plugin to make masks on form fields and html elements.
https://jsdaddy.github.io/ngx-mask
MIT License
1.15k stars 298 forks source link

Angular CLI cannot compile #483

Closed smlombardi closed 5 years ago

smlombardi commented 5 years ago

The line export const options: Partial<IConfig> | (() => Partial<IConfig>); from the instructions is flagged as an error, and compilation fails:

ERROR in src/app/web/inputfields/inputfields.module.ts(9,14): error TS1155: 'const' declarations must be initialized.
src/app/web/inputfields/inputfields.module.ts(9,31): error TS2304: Cannot find name 'IConfig'.
src/app/web/inputfields/inputfields.module.ts(9,57): error TS2304: Cannot find name 'IConfig'.
NepipenkoIgor commented 5 years ago

@smlombardi Thanks. Could you provide configuration ? Maybe package.json

smlombardi commented 5 years ago
"dependencies": {
    "@angular/animations": "7.2.2",
    "@angular/cdk": "7.3.0",
    "@angular/common": "7.2.2",
    "@angular/compiler": "7.2.2",
    "@angular/core": "7.2.2",
    "@angular/forms": "7.2.2",
    "@angular/http": "7.2.2",
    "@angular/material": "7.3.0",
    "@angular/platform-browser": "7.2.2",
    "@angular/platform-browser-dynamic": "7.2.2",
    "@angular/platform-server": "7.2.2",
    "@angular/router": "7.2.2",
    "@fortawesome/fontawesome-free": "5.7.0",
    "@ng-bootstrap/ng-bootstrap": "4.1.3",
    "@ng-select/ng-select": "2.15.1",
    "@nguniversal/express-engine": "^7.1.1",
    "@ngx-loading-bar/core": "4.2.0",
    "@ngx-loading-bar/http": "4.2.0",
    "@ngx-loading-bar/http-client": "4.2.0",
    "@ngx-loading-bar/router": "4.2.0",
    "angular-cc-library": "1.2.5",
    "angular-l10n": "5.0.0",
    "angular2-draggable": "2.1.9",
    "angulartics2": "6.2.0",
    "bootstrap": "4.3.1",
    "core-js": "2.5.7",
    "d3": "5.7.0",
    "font-awesome": "4.7.0",
    "hammerjs": "2.0.8",
    "ion-rangeslider": "2.1.6",
    "jasmine": "3.3.0",
    "jquery": "3.4.0",
    "leaflet": "1.3.3",
    "leaflet-fullscreen": "1.0.2",
    "leaflet.locatecontrol": "0.62.0",
    "ng-sidebar": "8.0.0",
    "ng2-dragula": "2.1.1",
    "ng2-file-upload": "1.3.0",
    "ng2-ion-range-slider": "2.0.0",
    "ngx-clipboard": "11.1.9",
    "ngx-color": "2.0.5",
    "ngx-cookie": "4.1.2",
    "ngx-infinite-scroll": "6.0.1",
    "ngx-toastr": "9.1.1",
    "popper.js": "1.14.7",
    "postcss": "7.0.14",
    "primeicons": "1.0.0",
    "primeng": "7.1.3",
    "prismjs": "1.15.0",
    "rxjs": "6.3.3",
    "tangram": "0.18.0",
    "zone.js": "0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.13.9",
    "@angular-devkit/build-ng-packagr": "~0.11.0",
    "@angular/cli": "7.2.3",
    "@angular/compiler-cli": "7.2.2",
    "@angular/language-service": "7.2.2",
    "@angularclass/hmr": "2.1.3",
    "@types/d3": "^5.7.0",
    "@types/hammerjs": "2.0.36",
    "@types/jasmine": "3.3.0",
    "@types/jquery": "3.3.22",
    "@types/leaflet": "1.2.9",
    "@types/leaflet-fullscreen": "1.0.4",
    "@types/leaflet.locatecontrol": "0.60.7",
    "@types/node": "10.12.11",
    "@types/prismjs": "1.9.0",
    "codelyzer": "4.5.0",
    "jasmine-core": "3.3.0",
    "jasmine-spec-reporter": "4.2.1",
    "karma": "^4.1.0",
    "karma-chrome-launcher": "2.2.0",
    "karma-cli": "2.0.0",
    "karma-coverage-istanbul-reporter": "2.0.4",
    "karma-jasmine": "2.0.1",
    "karma-jasmine-html-reporter": "1.4.0",
    "mkdirp": "0.5.1",
    "ng-packagr": "^4.2.0",
    "protractor": "5.4.1",
    "ts-node": "8.0.2",
    "tsickle": "0.34.0",
    "tslib": "1.9.3",
    "tslint": "5.12.1",
    "typescript": "3.2.4"
  },
visurel commented 5 years ago

@smlombardi You'll need to import the IConfig from the ngx-mask module and set it to some initial value, because it's a const so:

import { IConfig } from 'ngx-mask';
export const options: Partial<IConfig> | (() => Partial<IConfig>) = {};
smlombardi commented 5 years ago

OK, you might want to add the import info to the docs.

smlombardi commented 5 years ago

Now I get

Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[MaskService -> InjectionToken config]: StaticInjectorError(Platform: core)[MaskService -> InjectionToken config]: NullInjectorError: No provider for InjectionToken config! http://localhost:8082/vendor.js:69627:28 resolveToken@http://localhost:8082/vendor.js:69872:27 tryResolveToken@http://localhost:8082/vendor.js:69816:28 http://localhost:8082/vendor.js:69713:35 resolveToken@http://localhost:8082/vendor.js:69872:27 tryResolveToken@http://localhost:8082/vendor.js:69816:28 http://localhost:8082/vendor.js:69713:35 resolveNgModuleDep@http://localhost:8082/vendor.js:81853:32 resolveNgModuleDep@http://localhost:8082/vendor.js:81853:32 resolveNgModuleDep@http://localhost:8082/vendor.js:81853:32 createClass@http://localhost:8082/vendor.js:82793:42 createViewNodes@http://localhost:8082/vendor.js:83877:58 callViewAction@http://localhost:8082/vendor.js:84206:28 execComponentViewsAction@http://localhost:8082/vendor.js:84125:27 createViewNodes@http://localhost:8082/vendor.js:83918:29 createRootView@http://localhost:8082/vendor.js:83804:20 callWithDebugContext@http://localhost:8082/vendor.js:84812:30 http://localhost:8082/vendor.js:82143:43 http://localhost:8082/vendor.js:82254:51 http://localhost:8082/vendor.js:142629:55 http://localhost:8082/vendor.js:139876:52 http://localhost:8082/vendor.js:139827:33 forEach@[native code] http://localhost:8082/vendor.js:139826:36 http://localhost:8082/vendor.js:139883:41 http://localhost:8082/vendor.js:139827:33 forEach@[native code] http://localhost:8082/vendor.js:139826:36 http://localhost:8082/vendor.js:139883:41 http://localhost:8082/vendor.js:139827:33 forEach@[native code] http://localhost:8082/vendor.js:139826:36 http://localhost:8082/vendor.js:139843:41 http://localhost:8082/vendor.js:139827:33 forEach@[native code] http://localhost:8082/vendor.js:139826:36 http://localhost:8082/vendor.js:139751:33 http://localhost:8082/vendor.js:139735:22 http://localhost:8082/vendor.js:218440:39 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:221164:30 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:218446:30 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:220803:30 http://localhost:8082/vendor.js:212373:31 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:218446:30 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:215333:24 http://localhost:8082/vendor.js:212535:35 http://localhost:8082/vendor.js:212521:35 http://localhost:8082/vendor.js:212516:26 http://localhost:8082/vendor.js:220782:115 http://localhost:8082/vendor.js:220772:23 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:220803:30 http://localhost:8082/vendor.js:212373:31 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:218446:30 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:221164:30 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:218730:30 http://localhost:8082/vendor.js:212373:31 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:218446:30 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:220970:33 http://localhost:8082/vendor.js:213166:27 http://localhost:8082/vendor.js:213184:34 http://localhost:8082/vendor.js:213166:27 http://localhost:8082/vendor.js:218725:38 http://localhost:8082/vendor.js:213166:27 http://localhost:8082/vendor.js:223831:32 http://localhost:8082/vendor.js:212535:35 http://localhost:8082/vendor.js:212521:35 http://localhost:8082/vendor.js:212516:26 http://localhost:8082/vendor.js:212516:26 http://localhost:8082/vendor.js:212516:26 http://localhost:8082/vendor.js:212516:26 http://localhost:8082/vendor.js:218720:90 http://localhost:8082/vendor.js:218714:23 http://localhost:8082/vendor.js:218697:26 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:221164:30 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:215333:24 http://localhost:8082/vendor.js:212535:35 http://localhost:8082/vendor.js:212521:35 http://localhost:8082/vendor.js:212516:26 http://localhost:8082/vendor.js:212516:26 http://localhost:8082/vendor.js:212516:26 http://localhost:8082/vendor.js:212516:26 http://localhost:8082/vendor.js:220782:115 http://localhost:8082/vendor.js:220772:23 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:217885:34 http://localhost:8082/vendor.js:213154:23 http://localhost:8082/vendor.js:221164:30
NepipenkoIgor commented 5 years ago

@smlombardi I have just try this set of packages and all works fine. How you import and use ngx-mask package ?

NepipenkoIgor commented 5 years ago

@smlombardi You don't answer . If you steel have issue with build process please notify me

smlombardi commented 5 years ago

No problem. I had to give up and use another library.

schneiderjnt commented 5 years ago

I have the same problem and solve it. On Quickstart page, the declaration is: export const options: Partial<IConfig> | (() => Partial<IConfig>); But the correct is: export const options: Partial<IConfig> | (() => Partial<IConfig>) ={};

Works for me!

fernandorochaworld commented 4 years ago

Really this solves the problem.

toddhd commented 4 years ago

Thank you! I had the same problem. Using Angular 9.x with Ivy compiler.