Closed indraraj26 closed 4 years ago
I'm sorry but there's not enough information available for us to understand the issue. The repro you link to does not contain any Angular code, and you're saying it works if I understand correctly. I don't see any other repro that indicates there's framework issue.
Repo: https://github.com/indraraj26/ng-test-import-as
Run in terminal: npm run env-config
error you will get
D:\ng-test>npm run env-config
> ng-test@0.0.0 env-config D:\ng-test
> ts-node automate Development
D:\ng-test\automate.ts:1
import * as chalk from 'chalk';
^
SyntaxError: Unexpected token *
at Module._compile (internal/modules/cjs/loader.js:721:23)
at Module.m._compile (D:\ng-test\node_modules\ts-node\src\index.ts:473:23)
@indraraj26 - your problem does not appear to be related to the Angular project. You are not actually invoking the Angular framework (or even the Angular tools) in your reproduction. I suspect it is related to the output of the ts-node TypeScript compilation and your version of node, on which you are trying to run the code.
Closing as this is not an issue in Angular.
Note that ts-node will attempt to compile and run the source code using this https://github.com/indraraj26/ng-test-import-as/blob/master/tsconfig.json configuration.
And in particular it is set to "module": "esnext" (https://github.com/indraraj26/ng-test-import-as/blob/master/tsconfig.json#L10). So therefore the imports are not being downleveled to CommonJS require
calls and I suspect that your version of node.js cannot handle native ESM imports.
Hi @petebacondarwin ,
if you clone this https://github.com/indraraj26/automate-ng-build-process it will work without any issue. I copied devDependencies version of ts-node etc from angular package.json it is working fine.
"devDependencies": {
"@types/node": "^12.12.38",
"chalk": "^4.0.0",
"ora": "^4.0.4",
"prompt-confirm": "^2.0.4",
"ts-node": "^8.3.0",
"typescript": "^3.8.3"
}
TOO Fast I think it is totally related to ts-config configuration node version
node -v
v10.16.0
I will update my node version but how above util is working when i am not using inside angular project?
Thank you for your reply.
@indraraj26
https://github.com/webpack/webpack/issues/10460#issuecomment-599423728
Seems to me that the problem is related to ts-loader
, as per the linked issue above. It is supposed to be fixed in the next major version of webpack
https://github.com/webpack/webpack/projects/5#card-34930305
Just to update...
I just updated node to 12 version now i am getting this
D:\ng-test>npm run env-config
> ng-test@0.0.0 env-config D:\ng-test
> ts-node automate Development
D:\ng-test\automate.ts:1
import * as chalk from 'chalk';
^^^^^^
SyntaxError: Cannot use import statement outside a module
at wrapSafe (internal/modules/cjs/loader.js:1047:16)
at Module._compile (internal/modules/cjs/loader.js:1097:27)
D:\ng-test>node -v
v12.16.3
Hi @petebacondarwin , any suggestions? i have just written above TS to enhanced build show some configuration api url that are in environment.ts and run dist on local to test.
@indraraj26 - this is because ts-node
reads the tsconfig.json
file by default and in that file you will find "module": "esnext"
.
So when ts-node
compiles the TS file the output JS, which node is trying to run, will include the import
statement. The two solutions are:
1) Run node with ES modules support turned on. (See https://blog.logrocket.com/es-modules-in-node-js-12-from-experimental-to-release/)
2) Create a separate tsconfig.json
and pass this to ts-node
via the -p
flag.
Thank you @petebacondarwin . it is resolved with second option now my util will be helpful for me/others in future.
This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.
π bug report
Affected Package
The issue is caused by package @angular/.... ### Is this a regression? Yes, the previous version in which this bug was not present was: no idea ### Description I am using this utils to show configuration and run local test, It is working fine as a standalone (without angular). URL : https://github.com/indraraj26/automate-ng-build-process ``` import * as chalk from 'chalk'; import * as env from './src/environments/environment'; import * as envStaging from './src/environments/environment.staging'; import * as envProduction from './src/environments/environment.prod'; import * as envDev from './src/environments/environment.dev'; ``` ## π¬ Minimal Reproduction https://stackblitz.com/...π₯ Exception or Error
π Your Environment
Angular Version:
Anything else relevant?