we are using nodejs v20.14.0 and we have a project which is failing during compilation.
Error is the following:
[INFO] INTERNAL ERROR(undefined,undefined) @vue/cli-plugin-typescript/vue-compiler-sfc-shim: SyntaxError: Unexpected token '.'
[INFO] stack trace:
[INFO] Error: @vue/cli-plugin-typescript/vue-compiler-sfc-shim: SyntaxError: Unexpected token '.'
[INFO] at Function.resolveScriptBlock (D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\fork-ts-checker-webpack-plugin\lib\VueProgram.js:194:19)
[INFO] at Object.host.getSourceFile (D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\fork-ts-checker-webpack-plugin\lib\VueProgram.js:106:45)
[INFO] at findSourceFile (D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\typescript\lib\typescript.js:101559:29)
[INFO] at processImportedModules (D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\typescript\lib\typescript.js:101900:25)
[INFO] at findSourceFile (D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\typescript\lib\typescript.js:101607:17)
[INFO] at D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\typescript\lib\typescript.js:101436:85
[INFO] at getSourceFileFromReferenceWorker (D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\typescript\lib\typescript.js:101403:34)
[INFO] at processSourceFile (D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\typescript\lib\typescript.js:101436:13)
[INFO] at processRootFile (D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\typescript\lib\typescript.js:101259:13)
[INFO] at D:\temp\pofojs5\pofo-js\pofo-web\src\frontend-site\node_modules\typescript\lib\typescript.js:100183:60
meanwhile the list of dependencies is the defines in package.json as follows:
{
"name": "frontend-site",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.19.2",
"core-js": "^3.6.5",
"cors": "^2.8.5",
"tslib": "^2.1.0",
"vue": "^2.6.12",
"vue-axios": "^2.1.5",
"vue-class-component": "^7.2.5",
"vue-property-decorator": "^8.4.2",
"vue-router": "^3.4.3",
"vuetify": "^2.3.10",
"vuex": "^3.0.1",
"vuex-class": "^0.3.2",
"vuex-oidc": "^3.9.7"
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^2.33.0",
"@typescript-eslint/parser": "^2.33.0",
"@vue/cli-plugin-babel": "~4.4.0",
"@vue/cli-plugin-eslint": "~4.4.0",
"@vue/cli-plugin-router": "~4.4.0",
"@vue/cli-plugin-typescript": "~4.4.0",
"@vue/cli-service": "~4.4.0",
"@vue/eslint-config-typescript": "^5.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.2.2",
"rimraf": "^3.0.2",
"sass": "^1.19.0",
"sass-loader": "^8.0.0",
"typescript": "^3.9.7",
"vue-cli-plugin-vuetify": "^2.0.7",
"vue-template-compiler": "^2.6.12",
"vuetify-loader": "^1.6.0"
}
}
A collegue of mine told me this project was compiling fine one year ago but now (with no updates done) is failing. It is not clear to me the reason given the fact i am not much into nodejs: this is my first project working on this library .. maybe error is not in the dependency list ..
You probably have outdated packages which are now not compatible with node v20
Try downgrade your node version to previous LTS https://nodejs.org/en/blog/release/v18.18.0
I use NVM to handle node version much easier. Then you can try to build the webapp again
In case the node version is OK, I bet there is a dependence update for this fix.
I know Vue fixed several things in the v4.5.19 so try to use that version for the following packages:
"@vue/cli-plugin-babel": "~4.5.19",
"@vue/cli-plugin-eslint": "~4.5.19",
"@vue/cli-plugin-router": "~4.5.19",
"@vue/cli-plugin-typescript": "~4.5.19",
"@vue/cli-service": "~4.5.19",