console print error when I use cypress work with webpack.

[wangzhenxi]

Version

3.0.0-beta.6

Reproduction link

https://codepen.io/imjoshwong/pen/dmEzmB

Steps to reproduce

when I use vue-cli to create a project, I found the created folder haven't "webpack.config.js" file.I use my webpack config to this project and the project can run successfully. Then, I want to test my project, the console printed some error, I want to know why, so I found the document https://github.com/cypress-io/cypress-webpack-preprocessor, and install a plugin "@cypress/webpack-preprocessor", and add some config in plugins config, but the error is still exist.

// tests/plugins/index.js
const webpack = require('@cypress/webpack-preprocessor')

module.exports = (on, config) => {
  on('file:preprocessor', webpack({
    webpackOptions: require('../../webpack.config.js')
  }))
  return Object.assign({}, config, {
    fixturesFolder: 'tests/fixtures',
    integrationFolder: 'tests/specs',
    screenshotsFolder: 'tests/screenshots',
    videosFolder: 'tests/videos',
    supportFile: 'tests/support/index.js'
  })
}

What is expected?

I want to the progress run successfully as the first time.

What is actually happening?

The error is that the process cannot make out the webpack alias, and recommand me to install the alias, that is error absolutely.

[dhensche]

I could be wrong, but I believe the intent with v3.x is to not have a webpack.config.js file per se, and instead use one of documented methods to make webpack modifications.

[LinusBorg]

@dhesche is correct. If you use vue-cli 3, you don't define any webpack.config.js your own.

[laurentpayot]

@Joshwoooooooooooooooooooooooooooooooong you have to define your own config as your example is referencing to a non-existing (in vue-cli 3) webpack.config.js file.
This plugin config is used internally by Cypress, to set preprocessors, aliases for imports, loaders etc. To import project file for unit testing with Cypress it should be the same as the Vue config modified with chainWebpack or configureWebpack via vue.config.js.

You can see a full example of the Cypress plugin file here: quasarframework/quasar-cli#83 (comment)