Yarn2 compatibility #5135
Comments
|
I'm having the exact same issue. |
|
pretty sure you need |
|
yarn 2 comes with a lot of breaking changes that will require some serious work to make it work with this project. For example: since it has its own module resolution, webpack's So now we are in a situation where users will have to actively decide wether they want to use npm or yarn for a project, as we have to set up parts of the config differently. It also means you can't easily switch from npm to yarn by deleting It will take some time and likely a mahor release of Vue CLI to address yarn 2. Edit: It seems the yarn team made some changes that now support webpack aliases. One less thing to care about ... arcanis/pnp-webpack-plugin#17 Not sure if similiar fixes where applied to the plugins for jest, rollup etc. |
LinusBorg
changed the title
|
Supported in Vue CLI 4.2 (without the need of As far as I tested, there are still problems in the Contributions are welcome. |
|
for anyone reading, using vue-cli + yarn v2 with workspaces is broken because of |
|
I've put up a working example of a vue-cli app with Typescript / Yarn v2 + workspaces / Eslint here https://github.com/AlexandreBonaventure/workspace-yarn2-example |
|
I'm getting "Error: A package is trying to access another package without the second one being listed as a dependency of the first one" despite setting up packageExtensions:
"@vue/cli-service@*":
peerDependencies:
"@vue/cli-plugin-babel": "*"
"@vue/cli-plugin-eslint": "*"Error: Error: A package is trying to access another package without the second one being listed as a dependency of the first one
Required package: @vue/cli-plugin-babel (via "@vue/cli-plugin-babel")
Required by: @vue/cli-service@virtual:76152537329bf61477530d65c3327d65cb3ced27dbbd7306c7cd6a12bd3ef3338268a3b44c816b5f85136c0edcbbc855a8df1776f8ccb26a6a8b17b4f838dd60#npm:4.2.2 (via /project/.yarn/$$virtual/@vue-cli-service-virtual-29e59e8438/0/cache/@vue-cli-service-npm-4.2.2-fad0399727-2.zip/node_modules/@vue/cli-service/lib/)I'm not using TS. Any idea how to get |
|
@bkarlson make sure to run |
|
Any idea how to deal with this error? The |
|
answering myself, added to |
|
Like @bkarlson said above I currently need to have the following in .yarnrc.yml before running create: The above works for me when using the following preset: With the above I can run: And then yarn install, yarn serve, yarn build, yarn lint all work fine. However, when I run Despite the very unhelpful error spawn produces my best guess as to where the offending call is coming from is here: I'm not really sure how $$virtual is supposed to work but my impression is that that is some part of how yarn 2 extracts things out of the .zip files. Perhaps there is some issue caused by the recursive call to the same package? I have no idea. Since this is slightly outside the original "what is expected" of this issue (yarn serve) should I make a new issue for this or are we keeping things like this here? |
|
I think we should collect any yarn2 problems here. |
|
Hi there, since we're collecting issues with yarn 2 here, I thought I would report issues with the cypress plugin: Vue CLI v4.3.1
? Please pick a preset: Manually select features
? Check the features needed for your project: Babel, TS, PWA, Router, Vuex, CSS Pre-processors, Linter, Unit, E2E
? Use class-style component syntax? Yes
? Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? Yes
? Use history mode for router? (Requires proper server setup for index fallback in production) Yes
? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): Sass/SCSS (with dart-sass
)
? Pick a linter / formatter config: Prettier
? Pick additional lint features: Lint on save
? Pick a unit testing solution: Jest
? Pick an E2E testing solution: Cypress
? Where do you prefer placing config for Babel, ESLint, etc.? In dedicated config files
? Save this as a preset for future projects? No
$ cd hello-world
$ yarn
$ yarn set version berry
$ yarn
$ yarn test:e2e --headless # fails `Required package: babel-loader (via "babel-loader")`
$ yarn add -D babel-loader
$ yarn test:e2e --headless # fails `Required package: babel-loader (via "@babel/core")`
$ yarn add -D @babel/core
$ yarn test:e2e --headless # This dependency was not found: tslib
$ yarn add -D tslib
$ yarn test:e2e --headless # Hangs foreverCypress not opening with Yarn 2.0 was reported here: cypress-io/cypress#6377 {
"resolutions": {
"cypress": "^4.4.0"
}$ yarn
$ yarn test:e2e --headless
(Run Starting)
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ Cypress: 4.5.0 │
│ Browser: Electron 80 (headless) │
│ Specs: 1 found (test.js) │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
────────────────────────────────────────────────────────────────────────────────────────────────────
Running: test.js (1 of 1)
Oops...we found an error preparing this test file:
/home/patrick/hello-world/tests/e2e/specs/test.js
The error was:
Error: Cannot find module '@vue/cli-plugin-babel/preset' from '/home/patrick/hello-world' while parsing file: /home/patrick/hello-world/tests/e2e/specs/test.js
This occurred while Cypress was compiling and bundling your test code. This is usually caused by:
- A missing file or dependency
- A syntax error in the file or one of its dependencies
Fix the error in your code and re-run your tests.
Oops...we found an error preparing this test file:
/home/patrick/hello-world/tests/e2e/support/index.js
The error was:
Error: Cannot find module '@vue/cli-plugin-babel/preset' from '/home/patrick/hello-world' while parsing file: /home/patrick/hello-world/tests/e2e/support/index.js
This occurred while Cypress was compiling and bundling your test code. This is usually caused by:
- A missing file or dependency
- A syntax error in the file or one of its dependencies
Fix the error in your code and re-run your tests.
(Results)
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ Tests: 0 │
│ Passing: 0 │
│ Failing: 1 │
│ Pending: 0 │
│ Skipped: 0 │
│ Screenshots: 0 │
│ Video: true │
│ Duration: 0 seconds │
│ Spec Ran: test.js │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
(Video)
- Started processing: Compressing to 32 CRF
- Finished processing: tests/e2e/videos/test.js.mp4 (0 seconds)
====================================================================================================
(Run Finished)
Spec Tests Passing Failing Pending Skipped
┌────────────────────────────────────────────────────────────────────────────────────────────────┐
│ ✖ test.js 0ms - - 1 - - │
└────────────────────────────────────────────────────────────────────────────────────────────────┘
✖ 1 of 1 failed (100%) 0ms - - 1 - -
ERROR Error: Command failed: /home/patrick/hello-world/.yarn/unplugged/cypress-npm-4.5.0-a1072bd48b/node_modules/cypress/bin/cypress run --config baseUrl=http://localhost:8080/ --headless
Error: Command failed: /home/patrick/hello-world/.yarn/unplugged/cypress-npm-4.5.0-a1072bd48b/node_modules/cypress/bin/cypress run --config baseUrl=http://localhost:8080/ --headless
at makeError (/home/patrick/hello-world/.yarn/cache/execa-npm-1.0.0-7028e37029-3.zip/node_modules/execa/index.js:174:9)
at /home/patrick/hello-world/.yarn/cache/execa-npm-1.0.0-7028e37029-3.zip/node_modules/execa/index.js:278:16
at runMicrotasks (<anonymous>)
at processTicksAndRejections (internal/process/task_queues.js:97:5)At this point, I'm not sure how to resolve the issue. |
|
So I just tried using vue-cli with yarn 2 and found a few problems.
|
|
i have the same problem! when does vue can work with yarn2? |
|
After recent upgrade of most of vue-* packages,
The solution is similar to above, just add to vue-eslint-parser@*:
dependencies:
babel-eslint: "*" |
|
For vue 2 change yarnPath: ".yarn/releases/yarn-berry.js"
packageExtensions:
"vue-template-compiler@*":
dependencies:
"vue": "^2.6.10" |
|
In a vue 2 project without ts, all works fine. But, in another project with ts I couldn't make it works. After hours adding dependencies, setting yarn... I get this error: ERROR Failed to compile with 1 error 06:44:28
This dependency was not found:
* @/App.vue in ./src/main.ts
To install it, you can run: npm install --save @/App.vue
No type errors found
Version: typescript 4.1.5This is my npmAlwaysAuth: true
npmRegistryServer: "https://node.bit.dev"
npmScopes:
"@bit":
npmPublishRegistry: "https://node.bit.dev"
npmRegistryServer: "https://node.bit.dev"
packageExtensions:
"@vue/babel-preset-app@*":
peerDependencies:
vue: ^2.6.10
"@vue/cli-plugin-typescript@*":
dependencies:
babel-loader: "*"
"@vue/cli-service@*":
peerDependencies:
"@vue/babel-preset-app": "*"
"@vue/cli-plugin-babel": "*"
"@vue/cli-plugin-e2e-nightwatch": "*"
"@vue/cli-plugin-eslint": "*"
"@vue/cli-plugin-pwa": "*"
"@vue/cli-plugin-typescript": "*"
"@vue/cli-plugin-unit-jest": "*"
"@vue/babel-plugin-jsx@*":
peerDependencies:
"@babel/core": "*"
babel-loader@*:
dependencies:
"@babel/core": "*"
fork-ts-checker-webpack-plugin@*:
dependencies:
vue-template-compiler: "*"
peerDependencies:
typescript: "*"
vue-eslint-parser@*:
dependencies:
babel-eslint: "*"
vue-router@*:
peerDependencies:
vue: ^2.6.10
vue-template-compiler@*:
peerDependencies:
vue: ^2.6.10
"@yzfe/vue-svgicon@*":
peerDependencies:
"@yzfe/svgicon-loader": "*"
plugins:
- path: .yarn/plugins/@yarnpkg/plugin-typescript.cjs
spec: "@yarnpkg/plugin-typescript"
yarnPath: .yarn/releases/yarn-berry.js |
Version
4.1.2
Environment info
Steps to reproduce
vue create democommand, using the following presets:What is expected?
Create the project and run
yarn servesuccessfully.What is actually happening?
The shell output some errors:
The generated
package.jsonwas incomplete(missing scripts and dependencies):{ "name": "frontend", "version": "0.1.0", "private": true, "devDependencies": { "@vue/cli-plugin-babel": "^4.1.0", "@vue/cli-plugin-eslint": "^4.1.0", "@vue/cli-plugin-pwa": "^4.1.0", "@vue/cli-plugin-router": "^4.1.0", "@vue/cli-plugin-typescript": "^4.1.0", "@vue/cli-plugin-unit-mocha": "^4.1.0", "@vue/cli-plugin-vuex": "^4.1.0", "@vue/cli-service": "^4.1.0" } }Finally, faild to run
yarn serveThe text was updated successfully, but these errors were encountered: