Error: Cannot find module '@storybook/vue3/package.json'
Closed this issue · 1 comments
tatsumi-paypay commented
Describe the bug
I'm currently in the process of migrating our Vue 2.6 mono-repo app to Vue 3 (currently on vue/compat mode 2). The plan is to migrate each sub-app independently from the other sub-apps. While migrating a single sub-app (the rest are on Vue 2.6), I am getting this error when trying to lint (vue-cli-service lint ./) or build storybook (vue-cli-service storybook:build -c ../.storybook) in our shared-v2 module repo.
ERROR Error: Cannot find module '@storybook/vue3/package.json'
Require stack:
- /project/path/node_modules/vue-cli-plugin-storybook/lib/index.js
- /project/path/node_modules/@vue/cli-service/lib/Service.js
- /project/path/node_modules/node_modules/@vue/cli-service/bin/vue-cli-service.js
at Module._resolveFilename (node:internal/modules/cjs/loader:1077:15)
at Module._load (node:internal/modules/cjs/loader:922:27)
at Module.require (node:internal/modules/cjs/loader:1143:19)
at require (node:internal/modules/cjs/helpers:110:18)
at module.exports (/project/path/node_modules/vue-cli-plugin-storybook/lib/index.js:20:37)
at /project/path/node_modules/@vue/cli-service/lib/Service.js:82:9
at Array.forEach (<anonymous>)
at loadedCallback (/project/path/node_modules/@vue/cli-service/lib/Service.js:80:20)
at Service.init (/project/path/node_modules/@vue/cli-service/lib/Service.js:97:14)
at Service.run (/project/path/node_modules/@vue/cli-service/lib/Service.js:247:16)
at Object.<anonymous> (/project/path/node_modules/@vue/cli-service/bin/vue-cli-service.js:37:9)
at Module._compile (node:internal/modules/cjs/loader:1256:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
at Module.load (node:internal/modules/cjs/loader:1119:32)
at Module._load (node:internal/modules/cjs/loader:960:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
at node:internal/main/run_main_module:23:47
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
ERROR: command finished with error: command (/project/path/shared-v2) yarn run storybook:build exited (1)
Environment
- OS: MacOS
- Node.js version: lts-hydrogen
- Yarn 1.0
Additional context
.storybook/main.cjs
module.exports = {
core: {
builder: 'webpack5',
},
stories: ['../(shared|shared-v2|sub-app1|sub-app2)/**/*.stories.@(js|jsx|ts|tsx|mdx)'],
addons: [
'@storybook/addon-links',
'@storybook/addon-essentials',
'@storybook/addon-storysource',
],
}
our mono-repo structure
- project-root
-- shared
-- shared-v2
-- sub-app1
-- sub-app2
-- sub-app3
shared-v2's package.json
{
"name": "@root/shared-v2",
"version": "1",
"description": "Description",
"license": "UNLICENSED",
"author": "Author",
"type": "module",
"scripts": {
"lint": "vue-cli-service lint ./",
"storybook": "vue-cli-service storybook:serve -p 6006 -c ../.storybook",
"storybook:build": "vue-cli-service storybook:build -c ../.storybook",
"test": "vue-cli-service test:unit --runInBand --logHeapUsage",
"openapi:generate": "node ./scripts/openapiGenerator.cjs",
"devcert:install": "node ./scripts/devcertInstall.cjs"
},
"dependencies": {
"@gtm-support/vue2-gtm": "^1.2.1",
"@optimizely/optimizely-sdk": "^4.9.4",
"@root/shared": "*",
"@vue/compat": "^3.3.4",
"@vue/composition-api": "^1.7.2",
"axios": "^0.21.1",
"dompurify": "^3.0.5",
"js-cookie": "^3.0.1",
"lodash": "^4.17.21",
"lottie-web": "^5.1.9",
"moment": "^2.29.4",
"moment-timezone": "^0.5.35",
"portal-vue": "^2.1.7",
"semver": "^6.2.0",
"smoothscroll-polyfill": "^0.4.4",
"swiper": "^8.3.2",
"vue": "^3.1.0",
"vue-content-loader": "^0.2",
"vue-croppie": "^2.0.2",
"vue-gtag": "1",
"vue-i18n": "^8.22.3",
"vue-i18n-bridge": "^9.2.2",
"vue-input-facade": "^1.3.2",
"vue-lazyload": "^1.3.1",
"vue-router": "3.5.1",
"vue-virtual-scroller": "^1.0.10",
"vuex": "3.6.2",
"vuex-module-decorators": "^1.0.1"
},
"devDependencies": {
"@intlify/vue-i18n-loader": "^1.0.0",
"@storybook/addon-actions": "6.5.16",
"@storybook/addon-essentials": "6.5.16",
"@storybook/addon-links": "6.5.16",
"@storybook/addon-storysource": "6.5.16",
"@storybook/builder-webpack5": "^6.5.16",
"@storybook/core": "6.5.16",
"@storybook/manager-webpack5": "^6.5.16",
"@storybook/vue3": "^6.5.16",
"@types/assert": "^1.5.6",
"@types/dompurify": "^3.0.2",
"@types/faker": "^5.5.6",
"@types/js-cookie": "^3.0.1",
"@types/lodash": "^4.14.170",
"@types/semver": "^7.3.9",
"@vue/cli-plugin-babel": "~5.0.8",
"@vue/cli-plugin-eslint": "~5.0.8",
"@vue/cli-plugin-router": "~5.0.8",
"@vue/cli-plugin-typescript": "~5.0.8",
"@vue/cli-plugin-unit-jest": "~5.0.8",
"@vue/cli-plugin-vuex": "~5.0.8",
"@vue/cli-service": "~5.0.8",
"@vue/compiler-sfc": "^3.1.0",
"@vue/eslint-config-prettier": "6.0.0",
"@vue/eslint-config-typescript": "^9.1.0",
"@vue/test-utils": "1.1.3",
"@vue/vue2-jest": "27",
"babel-jest": "^27.5.1",
"commander": "^11.0.0",
"devcert": "^1.2.2",
"faker": "^5.5.3",
"html-webpack-plugin": "^4.0.0",
"http-proxy-middleware": "^2.0.6",
"jest": "^27.1.0",
"jest-canvas-mock": "^2.3.1",
"nock": "^13.1.0",
"openapi-typescript-codegen": "^0.25.0",
"sass": "1.32.13",
"sass-loader": "^10.1.1",
"ts-jest": "^27.0.4",
"typescript": "~4.5.5",
"vue-cli-plugin-storybook": "~2.1.0",
"webpack-merge": "^5.8.0"
},
"resolutions": {
"@achrinza/node-ipc": "^9.2.5"
}
}
tatsumi-paypay commented
Updating to "vue-cli-plugin-storybook": "^3.0.0-rc.1" fixed the issue