Home > Article > Web Front-end > Detailed explanation of the steps to build a vue2 unit test environment using karma+mocha+webpack3
This time I will bring you a detailed explanation of the environment steps using karma mocha webpack3 to build vue2Unit test, and what are the precautions for using karma mocha webpack3 to build a vue2 unit test environment. Here are Let’s take a look at practical cases.
I found many examples on the Internet about unit testing. They are all about how to add unit tests when creating a new project. How to add them using vue-cli, but my project has been generated and cannot be re-initialized again. At this time, there are many pitfalls in how to add unit tests. I will write down my experience here.
vue init webpack vuetest
npm i -D karma karma-webpack phantomjs-prebuilt karma-phantomjs-launcher karma-phantomjs-shim karma-chrome-launcher karma-sourcemap-loader mocha karma-mocha sinon chai sinon-chai karma-sinon-chai karma-spec-reporter karma-coverage istanbul-instrumenter-loader
"unit": "karma start test/unit/karma.conf.js --single-run",
const srcContext = require.context('../../src', true, /^\.\/(?!main(\.js)?$)/)
is changed to:
const srcContext = require.context('../../src', true, /^\.\/(style$) /)
npm run unit
At the same time, generate test reports in test/unit/coverage. The above is a simple vue unit test example. Finally, I present the source code
Vue.js learning series six - Vue unit test Karma Mocha study notes
karma webpack builds vue unit Test environment
karma mocha webpack3 builds vue2 unit test environment
Implementing background system permission control based on Vue2.0
[vue2. 0-Based on elementui skin change [custom theme]](https://juejin.im/post/5aea98...
Vue internationalization processing vue-i18n and automatic project switching Chinese and English
I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!
Recommended reading:
react Detailed explanation of the steps to highlight the selected li
Detailed explanation of the sorting algorithm example in the front end
The above is the detailed content of Detailed explanation of the steps to build a vue2 unit test environment using karma+mocha+webpack3. For more information, please follow other related articles on the PHP Chinese website!