前提:vue项目已创建,node.js、npm已安装

1、全局安装karma脚手架 karma-cli  【貌似可以不安装】

#npm i -g karma-cli

2、转到Vue项目目录,项目下安装karam包

#npm i --save-dev karma

Linux下Vue项目搭建karma测试框架-LMLPHP

好像npm i --save-dev karma安装失败了,运行一半卡死了,然后我又用了3的命令

3、install karma

#npm install karma --save-dev

Linux下Vue项目搭建karma测试框架-LMLPHP

4、查看karma安装情况

#karma --version

Linux下Vue项目搭建karma测试框架-LMLPHP

5、创建测试框架,自动生成 karma.conf.js:

#karma init

根据提示配置以下信息:

  • testing framework 测试框架:选用mocha
  • 使用Require.js:不使用
  • 监控的浏览器:选用Chrome、FireFox、IE
  • 要测试文件路径:src/**/*.js    test/**/*.js 【这里参照的别人的,但是vue应该要包括组件的测试,这才是最重要的TODO】
  • 是否开启检测:yes【开启了检测,当测试文件修改,会重新进行测试】

Linux下Vue项目搭建karma测试框架-LMLPHP

Linux下Vue项目搭建karma测试框架-LMLPHP

6、 编写测试文件【参考的vue官网:https://cn.vuejs.org/v2/guide/unit-testing.html】

  •  用VSCode打开vue-project项目

Linux下Vue项目搭建karma测试框架-LMLPHP

  • 在src下编写一个hello.vue

Linux下Vue项目搭建karma测试框架-LMLPHP

  • 相同目录下编写hello.js

Linux下Vue项目搭建karma测试框架-LMLPHP

7、进行测试:

#npm run unit

Linux下Vue项目搭建karma测试框架-LMLPHP

Linux下Vue项目搭建karma测试框架-LMLPHP

Linux下Vue项目搭建karma测试框架-LMLPHP

【这里的命令可能用的不对,是从package.json查看的命令,先暂时记录吧】

Linux下Vue项目搭建karma测试框架-LMLPHP

05-11 11:22