Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

./src/main.ts in multi ./src/main.ts issue while compiling application #4993

Closed
kumaresan-subramani opened this issue Dec 24, 2019 · 22 comments

Comments

@kumaresan-subramani
Copy link

Version

4.1.0

Reproduction link

https://github.com/kumaresan-subramani/ej2-vue-opennew-teamplate/blob/master/package.json

Environment info

"dependencies": {
        "@syncfusion/ej2": "*",
        "@syncfusion/ej2-vue-base": "*",
        "@syncfusion/ej2-vue-grids": "*",
        "@types/codemirror": "0.0.56",
        "@types/marked": "^0.3.0",
        "codemirror": "^5.37.0",
        "elasticlunr": "0.9.5",
        "fuse.js": "^3.2.0",
        "gulp-s3-upload": "^1.7.3",
        "marked": "^0.3.19",
        "tributejs": "^4.1.1",
        "vue": "^2.5.2",
        "vue-class-component": "4.3.1",
        "vue-property-decorator": "^6.0.0",
        "vue-router": "^3.0.1"
    },
    "devDependencies": {
        "@vue/cli-plugin-babel": "^4.1.0",
        "@vue/cli-plugin-eslint": "^4.1.0",
        "@vue/cli-plugin-typescript": "^3.7.0",
        "@vue/cli-service": "^4.1.0",
        "babel-eslint": "^10.0.3",
        "eslint": "^5.16.0",
        "eslint-plugin-vue": "^5.0.0",
        "vue-template-compiler": "^2.6.10"
    },

Steps to reproduce

  1. download below sample

sample.zip

  1. give npm i
  2. Then run npm run build
    you will see my error
D:\today\ej2-grid-vue-samples\ej2-vue-opennew-teamplate>npm run build

> cli-project@0.1.0 build D:\today\ej2-grid-vue-samples\ej2-vue-opennew-teamplate
> vue-cli-service build


\  Building for production...Starting type checking service...
Using 1 worker with 2048MB memory limit
\  Building for production...

 ERROR  Failed to compile with 1 errors                                                                       6:15:43 PM

This relative module was not found:

* ./src/main.ts in multi ./src/main.ts
 ERROR  Build failed with errors.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! cli-project@0.1.0 build: `vue-cli-service build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the cli-project@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\KumaresanSubramani\AppData\Roaming\npm-cache\_logs\2019-12-24T12_45_43_850Z-debug.log

D:\today\ej2-grid-vue-samples\ej2-vue-opennew-teamplate>  

What is expected?

build get succeed

What is actually happening?

build get failed

@kumaresan-subramani
Copy link
Author

#2934

@kumaresan-subramani
Copy link
Author

@sodatea , any suggestion on this.....?

@haoqunjiang
Copy link
Member

I’m sorry I’m on vacation (without a laptop) so I can’t take a closer look in your issue at the moment.
Will look into it later.

Happy holidays BTW 🙂

@kumaresan-subramani
Copy link
Author

Haha okay bro.....Thanks foryou reply..

Happy Christmas 👍

@haoqunjiang
Copy link
Member

Seems you don't need typescript for this particular project.

So, solutions:

  1. Just npm uninstall @vue/cli-plugin-typescript.
  2. Or, if you do need typescript support, you need to re-add the plugin correctly:
npm uninstall @vue/cli-plugin-typescript
vue add typescript

so that other peer dependencies of the plugin can be correctly installed.

@kumaresan-subramani
Copy link
Author

@sodatea , Facing same issue again after tried your suggestion.so i have created new sample

sample - https://github.com/kumaresan-subramani/check-sample

clone this sample and give npm i

once npm i completed give npm run build you will see my below error:

D:\today\ej2-vue-opennew-teamplate>npm run build

> cli-project@0.1.0 build D:\today\ej2-vue-opennew-teamplate
> vue-cli-service build


\  Building for production...

 ERROR  Failed to compile with 2 errors                                                                      11:29:17 AM

 error  in ./src/App.vue

Module Error (from ./node_modules/eslint-loader/index.js):
error: Parsing error: Unexpected reserved word 'let'

  27 |     },
  28 |     getDate: () => {
> 29 |         let date: string = '';
     |         ^
  30 |         date += ((new Date()).getMonth().toString()) + '/' + ((new Date()).getDate().toString());
  31 |         return date += '/' + ((new Date()).getFullYear().toString());
  32 |     }, at src\App.vue:66:8:
  64 |     },
  65 |     getDate: () => {
> 66 |         let date: string = '';
     |        ^
  67 |         date += ((new Date()).getMonth().toString()) + '/' + ((new Date()).getDate().toString());
  68 |         return date += '/' + ((new Date()).getFullYear().toString());
  69 |     },


1 error found.

 @ ./src/main.js 6:0-28 10:13-16
 @ multi ./src/main.js

 error  in ./src/App.vue?vue&type=script&lang=ts&

Module parse failed: Unexpected token (53:33)
File was processed with these loaders:
 * ./node_modules/cache-loader/dist/cjs.js
 * ./node_modules/vue-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|   },
|   methods: {
>       toolbarClick: function(args: ClickEventArgs) {
|         switch (args.item.text) {
|             /* tslint:disable */

 @ ./src/App.vue?vue&type=script&lang=ts& 1:0-166 1:182-185 1:187-350 1:187-350
 @ ./src/App.vue
 @ ./src/main.js
 @ multi ./src/main.js

 ERROR  Build failed with errors.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! cli-project@0.1.0 build: `vue-cli-service build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the cli-project@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\KumaresanSubramani\AppData\Roaming\npm-cache\_logs\2019-12-30T05_59_18_079Z-debug.log

D:\today\ej2-vue-opennew-teamplate>

@kumaresan-subramani
Copy link
Author

@sodatea can you pleae update on this bro...i am not able to go forward withut solving this bro?

@haoqunjiang
Copy link
Member

Seems I missed the typescript syntax in the previous sample project.
Then please follow the second suggestion and run vue add typescript

@kumaresan-subramani
Copy link
Author

kumaresan-subramani commented Dec 30, 2019

i have tried that too bro ad facing below issue:


> cli-project@0.1.0 build D:\today\ej2-vue-opennew-teamplate
> vue-cli-service build


\  Building for production...Starting type checking service...
Using 1 worker with 2048MB memory limit
-  Building for production...[BABEL] Note: The code generator has deoptimised the styling of D:\today\ej2-vue-opennew-teamplate\src\data-source.ts as it exceeds the max of 500KB.
-  Building for production...

 ERROR  Failed to compile with 2 errors                                                                      12:04:06 PM

 error  in ./src/App.vue

Module Error (from ./node_modules/eslint-loader/index.js):
error: Parsing error: '}' expected at src\App.vue:66:12:
  64 |     },
  65 |     getDate: () => {
> 66 |         let date: string = '';
     |            ^
  67 |         date += ((new Date()).getMonth().toString()) + '/' + ((new Date()).getDate().toString());
  68 |         return date += '/' + ((new Date()).getFullYear().toString());
  69 |     },


1 error found.

 @ ./src/main.ts 6:0-28 10:13-16
 @ multi ./src/main.ts

 error  in ./src/data-source.ts

Module Error (from ./node_modules/thread-loader/dist/cjs.js):

D:\today\ej2-vue-opennew-teamplate\src\data-source.ts
   9982:46  error  Unnecessary escape character: \-  no-useless-escape
   9982:52  error  Unnecessary escape character: \-  no-useless-escape
   9982:67  error  Unnecessary escape character: \.  no-useless-escape
   9982:85  error  Unnecessary escape character: \-  no-useless-escape
  23845:46  error  Unnecessary escape character: \-  no-useless-escape
  23845:52  error  Unnecessary escape character: \-  no-useless-escape
  23845:67  error  Unnecessary escape character: \.  no-useless-escape
  23845:85  error  Unnecessary escape character: \-  no-useless-escape
  23855:46  error  Unnecessary escape character: \-  no-useless-escape
  23855:52  error  Unnecessary escape character: \-  no-useless-escape
  23855:67  error  Unnecessary escape character: \.  no-useless-escape
  23855:85  error  Unnecessary escape character: \-  no-useless-escape

✖ 12 problems (12 errors, 0 warnings)


 @ ./node_modules/cache-loader/dist/cjs.js??ref--14-0!./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib!./node_modules/ts-loader??ref--14-3!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=ts& 5:0-45 10:12-24
 @ ./src/App.vue?vue&type=script&lang=ts&
 @ ./src/App.vue
 @ ./src/main.ts
 @ multi ./src/main.ts

 ERROR  Build failed with errors.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! cli-project@0.1.0 build: `vue-cli-service build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the cli-project@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\KumaresanSubramani\AppData\Roaming\npm-cache\_logs\2019-12-30T06_34_06_128Z-debug.log

sample - https://github.com/kumaresan-subramani/check-sample

@haoqunjiang
Copy link
Member

But this sample project does not have the @vue/cli-plugin-typescript dependency. Did you succeed in adding it?

@haoqunjiang
Copy link
Member

Got it. That's not the same error.

@kumaresan-subramani
Copy link
Author

yes, mistaken i have shared old sample

asd.zip

package.json

{
  "name": "cli-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.4.3",
    "eslint-loader": "^2.1.2",
    "vue": "^2.6.10",
    "vue-class-component": "^7.0.2",
    "vue-property-decorator": "^8.3.0"
  },
  "devDependencies": {
    "@syncfusion/ej2-vue-grids": "*",
    "@syncfusion/ej2-vue-navigations": "*",
    "@vue/cli-plugin-babel": "^4.1.0",
    "@vue/cli-plugin-eslint": "^4.1.0",
    "@vue/cli-plugin-typescript": "^4.1.2",
    "@vue/cli-service": "^4.1.0",
    "@vue/eslint-config-typescript": "^4.0.0",
    "babel-eslint": "^10.0.3",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
    "typescript": "~3.5.3",
    "vue-template-compiler": "^2.6.10"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended",
      "@vue/typescript"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "@typescript-eslint/parser"
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ]
}

@kumaresan-subramani
Copy link
Author

@sodatea , help me to get this done bro.....

@haoqunjiang
Copy link
Member

Previously there are parsing errors caused by incorrect configurations.

Now, these are just lint errors.
Either fix them or ignore the rule by adding

/* eslint-disable no-useless-escape */

at the beginning of the datasource.ts file.

@kumaresan-subramani
Copy link
Author

kumaresan-subramani commented Dec 30, 2019

Bro i have already resolved that lint error bro , below is my error

> cli-project@0.1.0 build D:\today\ej2-vue-opennew-teamplate
> vue-cli-service build


\  Building for production...Starting type checking service...
Using 1 worker with 2048MB memory limit
\  Building for production...[BABEL] Note: The code generator has deoptimised the styling of D:\today\ej2-vue-opennew-teamplate\src\data-source.ts as it exceeds the max of 500KB.
|  Building for production...

 ERROR  Failed to compile with 1 errors                                                                      12:18:18 PM

 error  in ./src/App.vue

Module Error (from ./node_modules/eslint-loader/index.js):
error: Parsing error: '}' expected at src\App.vue:66:12:
  64 |     },
  65 |     getDate: () => {
> 66 |         let date: string = '';
     |            ^
  67 |         date += ((new Date()).getMonth().toString()) + '/' + ((new Date()).getDate().toString());
  68 |         return date += '/' + ((new Date()).getFullYear().toString());
  69 |     },


1 error found.

 @ ./src/main.ts 6:0-28 10:13-16
 @ multi ./src/main.ts

 ERROR  Build failed with errors.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! cli-project@0.1.0 build: `vue-cli-service build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the cli-project@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\KumaresanSubramani\AppData\Roaming\npm-cache\_logs\2019-12-30T06_48_18_416Z-debug.log

@haoqunjiang
Copy link
Member

Replace <any>this.$refs.grid with this.$refs.grid as any

@haoqunjiang
Copy link
Member

haoqunjiang commented Dec 30, 2019

<any> is an ambiguous syntax due to the introduction of JSX syntax.
Though I don't understand why this turns out to be problematic even in lang="ts" blocks (should only raise error in lang="tsx"), it is the culprit.

@kumaresan-subramani
Copy link
Author

Replace <any>this.$refs.grid with this.$refs.grid as any

suggestion works fin bro.........

But it is working fine in here bro with same code- https://github.com/kumaresan-subramani/ej2-vue-samples/blob/master/src/grid/advance-export.vue#L57

I am facing issue only this sample - https://github.com/kumaresan-subramani/check-sample/blob/master/src/App.vue#L57

@haoqunjiang
Copy link
Member

I don't understand either…

My guess is that it might be a bug in https://github.com/typescript-eslint/typescript-eslint

@kumaresan-subramani
Copy link
Author

ohh okay ....thanks bro

@kumaresan-subramani
Copy link
Author

@sodatea , i have created vue sample with routing when i navigateone pageto another it adds # into url like below: i ther any way to remove that

http://localhost:8080/#/register

Here i dont want # to get add
route.zip

in angular, we can use locationhashstartegy like that any strategies available here?

@kumaresan-subramani
Copy link
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants