如何在使用vue cli创建的现有项目中包括测试？

Question

当我vue init webpack my-project按照这些说明进行操作时，我会收到一个问卷，询问我是否要包括棉绒和测试。如果我说“是”，则说明该项目已经建立并进行了测试。

但是，在我的一项Vue项目中，我一开始就没有说“是”。但是现在，我想包含单元测试。

安装Karma和Jasmine的传统方法似乎太麻烦了，我不知道需要修改哪些文件才能正确连接所有依赖项。

我是否可以运行一个CLI命令，再次询问这些问题，以便它自动为我进行单元测试？

Answer 1

这很旧，但是当您想将测试添加到我的vue-cliVue 项目中时遇到了这个问题，如果您使用的是Vue Cli 3，则可以运行vue add @vue/unit-jest将测试添加到现有项目中。

Answer 2

简短回答

不，你不能那样做

长答案

您应该在 GitHub 上查看 vue 模板的源代码。

vue-cli 的作用是使用询问器提示你输入你想要的内容，然后它设置一些变量来定义应该包含的内容。然后，它使用静态站点生成器 Metalsmith 和 Mustache 语法的组合将您指定的所需代码注入到文件中，然后将所有内容吐出到您指定的项目目录中。它还会过滤掉您选择退出的文件，并且不会将其放入根目录中。

当生成的文件放入项目目录时，js 文件和其他文件中的所有内联胡子和条件都已替换为与您指定的所需内容匹配的正确源代码，如果保留这些条件，则语法将无效，并且没有什么可以不失败地运行。由于这些条件和胡子在生成项目后已被删除，vue-cli 不知道将这些东西放在哪里，并且您可能还需要删除冲突的代码，因此如果不添加回条件和胡子是根本不可能的，然后你也可以手动复制东西。

我建议您将来选择您认为可能需要的所有内容，尤其是单元测试之类的内容，因为您不必使用它们，但如果您有它们，那就没有问题，linting 也很好始终包括在内，只需选择标准或爱彼迎并将其用于所有项目。如果您使用分号并在编写了应用程序的大部分代码后添加了标准 linting，那么事后添加 linting 可能需要您重构整个代码库。

另外，如果您确实探索了模板代码，您可能会看到 vue-cli 的作用，并了解需要添加到现有项目中的内容（如果再次生成项目并复制内容需要大量工作）。