bit build failed: dev+vue.dev-services.linter.v_zh54tchgb56oqy7unumk5ggzty\node_modules\@bitdev\vue.dev-services.linter.vue-eslint-config\dist\index.js': Cannot find module '@typescript-esdev+vue.dev-services.linter.v_zlint/eslint-plugin'

Question

bit build failed: dev+vue.dev-services.linter.v_zh54tchgb56oqy7unumk5ggzty\node_modules\@bitdev\vue.dev-services.linter.vue-eslint-config\dist\index.js': Cannot find module '@typescript-esdev+vue.dev-services.linter.v_zlint/eslint-plugin'

subham25997 opened this issue 5 months ago · 19 comments

subham25997 commented 5 months ago

With latest version of Bit,

I created a workspace using cmd:

bit new vue my-workspace --env bitdev.vue/vue-env --default-scope my-org.my-scope

Run bit install --add-missing-deps
Create a component using bit create vue ui/component
when I try bit build, I am getting the following error:

Specifications

Bit version: 1.8.20
Node version: 20.16.0
npm version: 10.8.1

Answer 1 · 2024-08-12T13:10:27.000Z

I tried installing @typescript-eslint/eslint-plugin also. But it didn't work

Answer 2 · 2024-08-13T05:19:36.000Z

@subham25997 sorry I can't reproduce it. May I have more information like the bit envs result and the forkFrom data in .bitmap?

For mine which doesn't reproduce:

$ bit envs
┌─────────────────────────────────────┬───────────────────────────────────┐
│ component                           │ env                               │
├─────────────────────────────────────┼───────────────────────────────────┤
│ my-org.my-scope/envs/my-vue-env     │ bitdev.general/envs/bit-env@1.0.8 │
├─────────────────────────────────────┼───────────────────────────────────┤
│ my-org.my-scope/envs/my-vue-wrapper │ bitdev.vue/vue-env@1.1.2          │
├─────────────────────────────────────┼───────────────────────────────────┤
│ my-org.my-scope/ui/my-first         │ my-org.my-scope/envs/my-vue-env   │
└─────────────────────────────────────┴───────────────────────────────────┘

{
    "envs/my-vue-env": {
        // ...
        "forkedFrom": {
            "scope": "bitdev.vue",
            "name": "examples/my-vue-env",
            "version": "1.1.3"
        }
    },
    "envs/my-vue-wrapper": {
        // ...
        "forkedFrom": {
            "scope": "bitdev.vue",
            "name": "examples/my-vue-wrapper",
            "version": "1.1.2"
        }
    },
    // ...
}

Thanks.

Answer 3 · 2024-08-13T06:09:43.000Z

For me, bit envs gives:

┌─────────────────────────────────────────────┬────────────────────────────────────┐
│ component                                   │ env                                │
├─────────────────────────────────────────────┼────────────────────────────────────┤
│ suite360/composables/use-table-header@0.0.3 │ suite360/envs/my-vue-env@0.0.3     │
│ suite360/composables/use-table-header@0.0.3 │ suite360/envs/my-vue-env@0.0.3     │
│ suite360/composables/use-table-header@0.0.3 │ suite360/envs/my-vue-env@0.0.3     │
│ suite360/composables/use-table-header@0.0.3 │ suite360/envs/my-vue-env@0.0.3     │
│ suite360/composables/use-table-header@0.0.3 │ suite360/envs/my-vue-env@0.0.3     │
├─────────────────────────────────────────────┼────────────────────────────────────┤
│ suite360/composables/use-table-header@0.0.3 │ suite360/envs/my-vue-env@0.0.3     │
│ suite360/composables/use-table-header@0.0.3 │ suite360/envs/my-vue-env@0.0.3     │
│ suite360/composables/use-table-header@0.0.3 │ suite360/envs/my-vue-env@0.0.3     │
│ suite360/composables/use-table-header@0.0.3 │ suite360/envs/my-vue-env@0.0.3     │
├─────────────────────────────────────────────┼────────────────────────────────────┤
│ suite360/core/app-navigation@0.0.3          │ suite360/envs/my-vue-env@0.0.3     │
│ suite360/core/app-navigation@0.0.3          │ suite360/envs/my-vue-env@0.0.3     │
├─────────────────────────────────────────────┼────────────────────────────────────┤
│ suite360/core/custom-button@0.0.3           │ suite360/envs/my-vue-env@0.0.3     │
├─────────────────────────────────────────────┼────────────────────────────────────┤
├─────────────────────────────────────────────┼────────────────────────────────────┤
│ suite360/core/data-table@0.0.4              │ suite360/envs/my-vue-env@0.0.3     │
├─────────────────────────────────────────────┼────────────────────────────────────┤
│ suite360/envs/my-vue-env@0.0.3              │ bitdev.general/envs/bit-env@1.0.10 │
├─────────────────────────────────────────────┼────────────────────────────────────┤
│ suite360/envs/my-vue-wrapper@0.0.2          │ bitdev.vue/vue-env@1.1.2           │
├─────────────────────────────────────────────┼────────────────────────────────────┤
│ suite360/envs/my-vue-wrapper@0.0.2          │ bitdev.vue/vue-env@1.1.2           │
├─────────────────────────────────────────────┼────────────────────────────────────┤
├─────────────────────────────────────────────┼────────────────────────────────────┤
│ suite360/layouts/default-layout@0.0.5       │ suite360/envs/my-vue-env@0.0.3

In .bitmap, it looks like:

"envs/my-vue-env": {
        "name": "envs/my-vue-env",
        "scope": "suite360",
        "version": "0.0.3",
        "mainFile": "index.ts",
        "rootDir": "suite360/envs/my-vue-env"
    },
    "envs/my-vue-wrapper": {
        "name": "envs/my-vue-wrapper",
        "scope": "suite360",
        "version": "0.0.2",
        "mainFile": "index.ts",
        "rootDir": "suite360/envs/my-vue-wrapper"
    },

Answer 4 · 2024-08-13T07:36:09.000Z

It looks fine. May I see bit show suite360/envs/my-vue-env and the code in ./config/eslintrc.cjs in that env component?

Answer 5 · 2024-08-13T10:10:14.000Z

@Jinjiang Please find it below:

bit show suite360/envs/my-vue-env

id               │ suite360/envs/my-vue-env@0.0.3                                        │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ scope            │ suite360                                                              │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ name             │ envs/my-vue-env                                                       │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ env              │ bitdev.general/envs/bit-env@1.0.10                                    │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ package name     │ @suite360/envs.my-vue-env                                             │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ deprecated       │ false                                                                 │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ forking          │ origin: bitdev.vue/examples/my-vue-env@1.1.0                          │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ main file        │ index.ts                                                              │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ files            │ env.jsonc                                                             │
│                  │ index.ts                                                              │
│                  │ my-vue-env.bit-env.ts                                                 │
│                  │ my-vue-env.docs.mdx                                                   │
│                  │ config\eslintrc.cjs                                                   │
│                  │ config\prettier.config.cjs                                            │
│                  │ config\tsconfig.json                                                  │
│                  │ config\vite.config.mjs                                                │
│                  │ config\vitest.config.mjs                                              │
│                  │ preview\docs.tsx                                                      │
│                  │ preview\mounter.tsx                                                   │
│                  │ config\types\types.d.ts                                               │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ dev files        │ my-vue-env.docs.mdx (teambit.docs/docs)                               │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ aspects          │ bitdev.general/envs/bit-env@1.0.10                                    │
│                  │ teambit.component/dev-files                                           │
│                  │ teambit.component/forking                                             │
│                  │ teambit.compositions/compositions                                     │
│                  │ teambit.dependencies/dependency-resolver                              │
│                  │ teambit.docs/docs                                                     │
│                  │ teambit.envs/envs                                                     │
│                  │ teambit.harmony/application                                           │
│                  │ teambit.pipelines/builder                                             │
│                  │ teambit.pkg/pkg                                                       │
│                  │ teambit.preview/preview                                               │
│                  │ teambit.semantics/schema                                              │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ dependencies     │ @babel/runtime@7.24.1------------------------------------ (package)   │
│                  │ @mdx-js/mdx@1.6.22--------------------------------------- (package)   │
│                  │ @mdx-js/react@1.6.22------------------------------------- (package)   │
│                  │ @teambit/mdx.ui.mdx-scope-context@1.0.7------------------ (package)   │
│                  │ @teambit/vite.pre-bundles.react.ui.docs-app@0.0.2-------- (package)   │
│                  │ @testing-library/vue@^8.0.3------------------------------ (package)   │
│                  │ @types/node@20.12.10------------------------------------- (package)   │
│                  │ @types/react@18.2.23------------------------------------- (package)   │
│                  │ @types/react-dom@^18.2.5--------------------------------- (package)   │
│                  │ @vitejs/plugin-vue@^5.1.2-------------------------------- (package)   │
│                  │ @vitest/coverage-v8@^2.0.3------------------------------- (package)   │
│                  │ @bitdev/vue.dev-services.compiler.vue-compiler@1.0.5----- (component) │
│                  │ @bitdev/vue.dev-services.linter.vue-eslint-config@0.0.10- (component) │
│                  │ @bitdev/vue.dev-services.preview.vue-docs-template@0.0.9- (component) │
│                  │ @bitdev/vue.dev-services.preview.vue-mounter@0.0.8------- (component) │
│                  │ @bitdev/vue.dev-services.preview.vue-vite-preview@0.0.11- (component) │
│                  │ @bitdev/vue.envs.vue-modern-env@1.0.16------------------- (component) │
│                  │ @bitdev/vue.vue-env@1.1.2-------------------------------- (component) │
│                  │ core-js@^3.36.1------------------------------------------ (package)   │
│                  │ eslint@8.56.0-------------------------------------------- (package)   │
│                  │ eslint-plugin-vitest@^0.5.4------------------------------ (package)   │
│                  │ jest@29.7.0---------------------------------------------- (package)   │
│                  │ jsdom@^24.0.0-------------------------------------------- (package)   │
│                  │ less@^4.2.0---------------------------------------------- (package)   │
│                  │ react@18.2.0--------------------------------------------- (package)   │
│                  │ react-dom@18.2.0----------------------------------------- (package)   │
│                  │ sass@^1.62.1--------------------------------------------- (package)   │
│                  │ @suite360/envs.my-vue-wrapper@0.0.2---------------------- (component) │
│                  │ @teambit/defender.eslint-linter@1.0.38------------------- (component) │
│                  │ @teambit/defender.prettier-formatter@1.0.18-------------- (component) │
│                  │ @teambit/mdx.ui.mdx-scope-context@1.0.7------------------ (component) │
│                  │ @teambit/typescript.typescript-compiler@2.0.43----------- (component) │
│                  │ @teambit/vite.pre-bundles.react.ui.docs-app@0.0.2-------- (component) │
│                  │ @teambit/vite.vitest-tester@0.1.7------------------------ (component) │
│                  │ vite@^5.3.4---------------------------------------------- (package)   │
│                  │ vitest@^2.0.3-------------------------------------------- (package)   │
│                  │ vue@^3.2.45---------------------------------------------- (package)   │
│                  │ vuetify@^3.6.14------------------------------------------ (package)   │
├──────────────────┼───────────────────────────────────────────────────────────────────────┤
│ dev dependencies │ @types/jest@29.5.11---------------------------- (package)             │
│                  │ @types/testing-library__jest-dom@5.14.9-------- (package)             │
│                  │ @bitdev/general.envs.bit-env@1.0.10------------ (component)           │
│                  │ @teambit/envs.docs.env-overview-template@0.0.3- (component)           │
└──────────────────┴───────────────────────────────────────────────────────────────────────┘

./config/eslintrc.cjs

Answer 6 · 2024-08-13T10:58:30.000Z

When I do bit install --add-missing-deps, I am getting this as well

Answer 7 · 2024-08-13T19:19:41.000Z

After creating your component, please run bit install and then try and see if it is working.
If it is not, please run bit status. in case you see any error, rerun with bit status --log and share here the error printed.

Answer 8 · 2024-08-13T23:15:15.000Z

@itaymendel agree.

@subham25997 addition to the errors on your last screenshot: it's fine during the process. the thing you need to check is

whether the installation completes at the end with a message like Successfully installed dependencies and compiled X component(s) in XXX seconds
bit status after the installation completes.

and sometimes a fully re-installation helps:

rm -r node_modules pnpm-lock.yaml
bit install
bit ws-config write
bit status

If you found any Bit command failed, the --log error argument will help us to collect information to further analyze.

Thanks.

Answer 9 · 2024-08-14T06:45:50.000Z

I tried and bit install was successful. Also, bit status doesn't show any issues. But I am getting this error on bit build

Answer 10 · 2024-08-14T07:40:42.000Z

I see. Seems this time the error message was different. Would you mind bit build --log error again to check the full error log? Thanks.

Update: this error message seems probably a Windows-specific issue. I'll try to reproduce it again 🤔

Answer 11 · 2024-08-14T09:39:48.000Z

I got this after running bit build --log error:

Answer 12 · 2024-08-14T12:13:41.000Z

@Jinjiang Please follow below steps to reproduce the issue:

Delete .bvm folder from your system.
Now install bvm and bit using npm install -g @teambit/bvm and bvm install
Create a vue workspace using:
bit new vue my-workspace --env bitdev.vue/vue-env --default-scope my-org.my-scope
Create a vue component and run bit build

Answer 13 · 2024-08-15T06:01:46.000Z

I think I've reproduced it on my Windows. I will try to solve it and keep you posted. 🙏

Update: If you want to proceed before it on Windows, maybe you can work on your workspace in the WSL environment.

Thanks.

Answer 14 · 2024-08-15T17:08:43.000Z

From what I've tried, there is a hack to make it works:

run bit build --log error to get the error stack, find the file node_modules\.pnpm\xxx\@eslint\eslintrc\dist\eslintrc.cjs
goto line: L2345 (should be function resolve(moduleName, relativeToPath) { ... })
- explain: here the relativeToPath sometimes is \C:\xxx on Windows which should be C:\xxx. so:
add if (relativeToPath.match(/^\\C\:/)) { relativeToPath = relativeToPath.replace(/^\\C\:/, "C:") } at the beginning of the function.
save and run bit build and the task should be completed without errors.

That's what I've debugged so far.

/cc @GiladShoham since the trigger I've found is inside the package @eslint/eslintrc, I'm still not quite sure how to avoid it through our side. maybe you have some ideas?

Thanks.

Answer 15 · 2024-08-16T04:05:47.000Z

@subham25997 bitdev.vue/vue-env v1.1.3 should work as expected. to upgrade, I guess you need to:

bit envs update bitdev.vue/vue-env
for suite360/envs/my-vue-env, change this line of code:
dirname(new URL(import.meta.url).pathname) into dirname(fileURLToPath(import.meta.url)) and at the same time add import { fileURLToPath } from 'url' at the top. (example)

Thanks.

Answer 16 · 2024-08-16T05:42:51.000Z

Thank you @Jinjiang it's working. But I am getting another issue when I do bit start:

Preview for components is not working

Answer 17 · 2024-08-16T10:06:00.000Z

I see. I think there are 2 issues:

for the terminal error: you might need to update the package @teambit/vite.pre-bundles.react.ui.docs-app to the latest. Go to my-vue-env/env.jsonc to edit it should be from v0.0.2 to v0.0.5.
for the browser console error: I will take a further look. (Did it happen previously?)

Thanks.

Answer 18 · 2024-08-16T11:00:23.000Z

@Jinjiang Yes the second issue started when I updated my bit to the latest version.

Answer 19 · 2024-08-19T10:03:19.000Z

Closing this issue and have created a new issue #9122 for component previews not loading.