Question

Karma提供了一个名为customContextFile的配置选项，允许用户指定Karma将提供的HTML文件。

我的问题是 - 我可以直接将<script>标记添加到自定义上下文文件中吗？或者我是否必须使用karma配置中的files属性来在浏览器中加载文件？

更多信息

我想将脚本标签直接放在我的customContextFile上，以便它看起来类似于index.html，列出了所有供应商文件等。

但是，karma列出了我添加到自定义上下文文件中的脚本标签的404s。我怀疑这是因为我没有在karma config的files属性中列出这些文件。或者脚本标签中的路径可能不正确？

目录结构

.
|--app
|   |--mock
|   |   |--*.json
|   |--scripts
|   |   |--*.ts
|   |--vendor
|   |   |--*.js
|
|--config
|   |--karma.conf.js
|
|--dist
|   |--mock
|   |   |--*.json
|   |--scripts
|   |   |--*.js
|   |--tests
|   |   |--*.js
|   |--vendor
|   |   |--*.js
|   |--specRunner.html
|

配置/ karma.conf.js

config.set({
    basePath: '../dist',
    frameworks: ['jasmine'],
    reporters: ['dots'],
    port: 9876,
    colors: false,
    logLevel: config.LOG_DEBUG,
    browserNoActivityTimeout: 100000,
    plugins: [
        'karma-chrome-launcher',
        'karma-jasmine'
    ],

    customContextFile: 'specRunner.html',

    files: [
        {pattern: 'vendor/**/*.js', included: false, watched: false},
        {pattern: 'mock/**/*.json', included: false, watched: false},
        {pattern: 'scripts/**/*.js', included: false},
        {pattern: 'tests/**/*.js', included: false}
    ]
    ...

DIST / specRunner.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Spec Runner</title>
</head>
<body>

<h1>Thank you for reading this far</h1>

<h2>Karma 404s with each of these</h2>
<script src="jQuery/jquery-1.7.min.js"></script>
<script src="vendor/jQuery/jquery-1.7.min.js"></script>
<script src="dist/vendor/jQuery/jquery-1.7.min.js"></script>

...etc...

<script src="scripts/app.js"></script>
<script src="scripts/x.module.js"></script>
<script src="scripts/y.module.js"></script>
<script src="scripts/z.module.js"></script>

...etc...  

</body>
</html>

Answer 1

Karma配置中的files选项可执行多个作业。其中一项工作是告诉Karma要创建的script元素。然而，其另一项工作是告诉Karma要服务的脚本。您不能只在HTML中手动放置script元素并将其调用完毕。你需要配置Karma以便提供文件，因为如果没有列出它们，Karma就不会为它们提供服务。

您可以在配置中使用这样的模式告诉Karma提供文件，但不要将它们（included: false）包含在页面上作为script元素：

files: [
  { pattern: "vendor/**/*.js", included: false },
  { pattern: "scripts/**/*.js", included: false },
  // ...
]

此外，节点表示所有内容都将在浏览器端的/base下提供。因此，文件scripts/app.js将作为/base/scripts/app.js提供，后一个路径是您必须在script或每当您引用该文件时使用的路径。

如果您对Karma看到的内容及其服务方式感到困惑，您可以在浏览器中进入调试模式并检查变量__karma__.files。它是Karma能够提供的文件名映射：键是文件名，每个键的值是文件内容的校验和。

业力 - 我可以使用脚本标签而不是karma.config.files吗？

更多信息

1 个答案: