Vue-cli: Cypress required when building production

[cybercode]

Version

3.0.0-beta.6

Reproduction link

https://gist.github.com/cybercode/49e97783e92b2bdd2710c1e5d9e55508

Steps to reproduce

move build dependencies out of dev. Leave test dependencies in dev

What is expected?

yarn build should build the dist

What is actually happening?

error from vue-cli-service due to missing cypress library

---

Esp. deploying from a docker environment, the time required to download cypress, which is not needed for the build is problematic. You should be able to run vue-cli-service build without having to install the test tools.

[AngeloCicero]

This would be really helpful.

[yyx990803]

You probably should have some form of dependency caching based on lockfile hash...

[cybercode]

That’s possible. I will test that premise

[sodatea]

Moving build tools to dependencies does not make sense.

IMHO, the build result should be e2e tested before deploying, so cypress is required in that case.
Otherwise, you can move @vue/cli-plugin-e2e-cypress to optionalDependencies and use yarn install --ignore-optional / npm install --no-optional in docker environments.

[gjuchault]

@sodatea I've tried to move @vue/cli-plugin-e2e-cypress to optionalDependencies and I have the issue described by the author: vue-cli needs all plugins to be installed and thus I have a missing package error.

Could we reopen this issue ?

[tommoyangn]

I'd like to +1 this issue. It doesn't make sense to me that we can't separate build tools from test tools. Yes, builds should be tested before deploying, but it doesn't make sense that it's tightly coupled in this way.

In our Jenkins setup where we build our app serially but then test different aspects concurrently this adds a significant amount of time to each build that isn't necessary, since not all of our tests require cypress (We're a PHP shop).

[sodatea]

With the newest release, it is now possible to move @vue/cli-plugin-e2e-cypress to optionalDependencies without causing any errors. So I'll mark this issue as resolved.

[bpkennedy]

This doesn't appear to be the case. I am on @vue/cli-service ^3.3.0 (for all plugins, as well) and I have moved @vue/cli-plugin-e2e-cypress to optionalDependencies and I receive a failure in my gitlabCI build when running the default lint task:

> vue-cli-service lint

 WARN  Optional dependency @vue/cli-plugin-e2e-cypress is not installed.
 ERROR  Error: Failed to load plugin cypress: Cannot find module 'eslint-plugin-cypress'
Error: Failed to load plugin cypress: Cannot find module 'eslint-plugin-cypress'

And the gitlab-ci.yml, I have the task defined as:

lint:
  stage: lint
  image: node:10
  script:
  - npm install --progress=false --no-optional
  - npm run lint

...and if it's any value, some potentially relevant details from my package.json:

"engines": {
    "node": "10.0.0"
  },
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "build-report": "vue-cli-service build --report",
    "lint": "vue-cli-service lint",
    "electron:build": "vue-cli-service electron:build",
    "electron:serve": "vue-cli-service electron:serve",
    "postinstall": "electron-builder install-app-deps",
    "test:e2e": "vue-cli-service test:e2e",
    "test:unit": "vue-cli-service test:unit"
  },
  "dependencies": {
    "@firebase/app": "^0.3.5",
    "@firebase/auth": "^0.9.1",
    "@firebase/firestore": "^0.9.1",
    "element-ui": "^2.4.5",
    "firebase": "^5.7.1",
    "jdenticon": "^2.1.1",
    "moment": "^2.23.0",
    "register-service-worker": "^1.5.2",
    "vue": "^2.5.17",
    "vue-awesome": "^3.3.1",
    "vue-password-strength-meter": "^1.4.1",
    "vue-router": "^3.0.1",
    "vuex": "^3.0.1",
    "vuex-easy-firestore": "^1.22.1",
    "zxcvbn": "^4.4.2"
  },
  "devDependencies": {
    "@vue/babel-preset-app": "^3.3.0",
    "@vue/cli-plugin-babel": "^3.3.0",
    "@vue/cli-plugin-eslint": "^3.3.0",
    "@vue/cli-plugin-pwa": "^3.3.0",
    "@vue/cli-plugin-unit-jest": "^3.3.0",
    "@vue/cli-service": "^3.3.0",
    "@vue/cli-shared-utils": "^3.3.0",
    "@vue/eslint-config-standard": "^4.0.0",
    "@vue/test-utils": "^1.0.0-beta.20",
    "babel-core": "7.0.0-bridge.0",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^23.6.0",
    "connect-history-api-fallback": "^1.6.0",
    "electron": "^3.0.0",
    "eslint": "^5.8.0",
    "eslint-plugin-vue": "^5.0.0-0",
    "express": "^4.16.4",
    "node-sass": "^4.9.0",
    "nodemailer": "^5.1.1",
    "sass-loader": "^7.0.1",
    "superstruct": "^0.6.0",
    "vue-cli-plugin-electron-builder": "^1.0.0-rc.10",
    "vue-template-compiler": "^2.5.17"
  },
  "optionalDependencies": {
    "@vue/cli-plugin-e2e-cypress": "^3.3.0"
  },

[sodatea]

@bpkennedy
It is because the tests/e2e sub directory contains its own .eslintrc.js, which requires eslint-plugin-cypress. Normally, if @vue/cli-plugin-e2e-cypress is installed then this package would have already existed.
So in this case, you need to run the lint command with an additional argument:

npm run lint -- --ignore-pattern tests/e2e

[bpkennedy]

Ah awesome, ty