当我使用最新的 angular-cli(beta 15 w/webpack)运行 ng test 时，如何提供资产? [英] How do I serve assets when I run ng test using latest angular-cli (beta 15 w/webpack)?

问题描述

当我尝试运行 ng 测试时，我的所有模块和组件都正确加载，但是我包含在 <img> 标签中的任何资产都不会呈现，因为它们没有被在/assets 文件夹中提供服务(就像在构建或开发过程中使用 ng serve 一样)

When I try and run an ng test, all of my modules and components load correctly, but any of the assets I include in <img> tags do not render because they're not being served in the /assets folder (like they would in a build or during development using ng serve)

除此之外，很高兴知道如何将全局 style.scss/css 文件包含在测试中，因为如果我将 CSS 放入组件中，我只能渲染这些样式并且禁用 ViewEncapsulation.

In addition to this, it would be nice to know how to get the global styles.scss/css file to be included in the test, as I can only get these styles to render if I drop the CSS into a component and disable ViewEncapsulation.

我正在使用最新的 angular-cli webpack 版本(Beta 15)

I'm on the latest angular-cli webpack release (Beta 15)

非常感谢任何帮助.

推荐答案

我找到了答案！

默认情况下，angular-cli (webpack) 中的 karma 设置默认不会为您的资产文件夹提供服务，但是添加起来非常简单(一旦您仔细阅读文档)

By default, the karma setup in the angular-cli (webpack) doesn't serve your assets folder by default, but this is very simple to add (once you sift through the documentation)

下面是我的结果和我添加的代码的截图

below is a screenshot of my results and the code I added to get it to work

在左侧，您可以看到我的 Billy Mays 图像正在提供，如果您查看 json 的文件"部分，则在右侧，我添加了以下内容:

To the left you can see my image of Billy Mays is now being served, to the right if you look at the 'file' section of the json, I added the following:

{ pattern: './src/assets/**', watched: false, included:false, nocache:false, served:true }

我还添加了一个代理属性，以获取提供的内容(默认在 http://localhost:[karma 端口号]/base

I also added a proxies property, to take the served content (served by default at http://localhost:[karma port number]/base

proxies: {
   '/assets/': '/base/src/assets/'
},

通过指定 /assets/ 作为文件夹代理，karma 使用路径localhost:[karma port number]/assets 而不是默认值.

By specifying /assets/ as the folder proxy, karma uses the path localhost:[karma port number]/assets instead of the default.

我很高兴能够回答我自己的问题，希望这能帮助一些开始使用 angular-cli 的人！

I'm happy I was able to my own question, and hope this helps some people starting with the angular-cli!

这篇关于当我使用最新的 angular-cli(beta 15 w/webpack)运行 ng test 时，如何提供资产?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！