l-lin / angular-datatables

DataTables with Angular
https://l-lin.github.io/angular-datatables/
MIT License
1.58k stars 486 forks source link

Installing datatables dependency results with error "Cannot use import statement outside a module" #1621

Closed blekione closed 2 years ago

blekione commented 2 years ago

:beetle: bug report

When installing the datatables dependency I have an error in console:

ℹ Using package manager: npm
✔ Found compatible package version: angular-datatables@13.0.0.
✔ Package information loaded.

The package angular-datatables@13.0.0 will be installed and executed.
Would you like to proceed? Yes
✔ Package successfully installed.
An unhandled exception occurred: Cannot use import statement outside a module
See "/private/var/folders/6j/16zvl6693lb48nw2l2mfqvgwt44vzf/T/ng-zHMNcn/angular-errors.log" for further details.

And the content of the the angular-errors.log:

[error] /Users/mkrg/git/repos/angular/test/test/node_modules/angular-datatables/schematics/src/ng-add/index.js:1
import { chain } from '@angular-devkit/schematics';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at wrapSafe (internal/modules/cjs/loader.js:988:16)
    at Module._compile (internal/modules/cjs/loader.js:1036:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
    at Module.load (internal/modules/cjs/loader.js:937:32)
    at Function.Module._load (internal/modules/cjs/loader.js:778:12)
    at Module.require (internal/modules/cjs/loader.js:961:19)
    at require (internal/modules/cjs/helpers.js:92:18)
    at new ExportStringRef (/Users/mkrg/git/repos/angular/test/test/node_modules/@angular-devkit/schematics/tools/export-ref.js:19:25)
    at SchematicEngineHost._resolveReferenceString (/Users/mkrg/git/repos/angular/test/test/node_modules/@angular-devkit/schematics/tools/node-module-engine-host.js:96:21)
    at SchematicEngineHost._resolveReferenceString (/Users/mkrg/git/repos/angular/test/test/node_modules/@angular/cli/models/schematic-engine-host.js:69:22)

:microscope: Minimal Reproduction

to reporduce:

ng new test
cd test
ng add angular-datatables

:globe_with_meridians: Your Environment

ng --version:

ngular CLI: 12.2.13
Node: 14.17.6
Package Manager: npm 6.14.15
OS: darwin x64

Angular: 12.2.13
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1202.13
@angular-devkit/build-angular   12.2.13
@angular-devkit/core            12.2.13
@angular-devkit/schematics      12.2.13
@schematics/angular             12.2.13
rxjs                            6.6.7
typescript                      4.3.5

Just tried to update ng to latest vertsion (13.0.3) with no change

shanmukhateja commented 2 years ago

Hi, this is a known issue with v13.0.0 A fix will be made available at the earliest.

The workaround for Angular 12 apps is ng add angular-datatables@12.0.1

Edit: New version will be after #1622 is merged.

blekione commented 2 years ago

OK. Thank you.

I've tried to find similar issue (open or closed) but nothing has been returned by the search.

Can confirm that above version is working for my Angular 12 project