Vue + 摩卡，如果 vue 单文件有标签，则 0 测试通过<style>

Question

我在Ruby on Rails应用程序中实现VueJS，使用webpacker和vueonrails gem，我在测试Vue实现时遇到了麻烦。

我有一堆使用单个文件模式的.vue文件。如果我对仅包含和标签的文件进行测试，则文件夹和子文件夹的所有文件都正确执行，在同一文件夹中具有<style>标签而没有测试文件的其他组件。

如果我运行测试，结果是 45 次测试通过。

然后，如果我用<style>编写其中一个文件的测试，然后再次运行测试，它将执行而没有错误，但说 0 测试通过，避免通过文件夹的所有测试。

如果我对没有<script>标签的文件运行特定测试，它会正常通过文件的所有测试，如果我用<script>测试文件，则测试通过 0。

我正在使用摩卡包和忽略样式来运行以下命令：

NODE_ENV=test mochapack --webpack-config config/webpack/test.js --require ignore-styles --require app/webpacker/src/test/setup.js --glob '*.spec.js' app/webpacker/src/components --recursive

我的事情与在规范.js文件中导入 Vue 组件有关，但我不知道如何解决它，以及为什么使用<template> + <script>文件而不是<template> + <script> + <style>文件。

Answer 1

你能提供你的测试配置吗？ 我遇到了类似的问题，这是由错误的配置引起的。在 dev/prod env 中，样式由 ruby gem 加载，但整个测试 env 由节点运行。所以在测试配置中，我不得不为 css 添加加载器：

environment.loaders.prepend('css', {
test: /.css$/,
use: [
'vue-style-loader',
'css-loader',
'sass-loader',
],
});