Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/39.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/image/5.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css 如何将图像与模块耦合?_Css_Image_Path_Angular Cli - Fatal编程技术网

Css 如何将图像与模块耦合?

Css 如何将图像与模块耦合?,css,image,path,angular-cli,Css,Image,Path,Angular Cli,这与 Angular 1.6中有一个报头组件,我正在使用Angular CLI将其移植到Angular2项目中。在Angular 1.6中,在控制器及其CSS旁边有一个图像很简单,然后使用相对于组件目录的路径轻松地引用它。例如: -components --my-component ---my-component.controller.js ---my-component.css ---my-image.jpg In my-component.css: background-image: u

这与

Angular 1.6中有一个报头组件,我正在使用Angular CLI将其移植到Angular2项目中。在Angular 1.6中,在控制器及其CSS旁边有一个图像很简单,然后使用相对于组件目录的路径轻松地引用它。例如:

-components
--my-component
---my-component.controller.js
---my-component.css
---my-image.jpg

In my-component.css:
 background-image: url(my-image.jpg);
根据引用的问题,这在Angular CLI中是不可能的。他们建议将图像移动到“资源”文件夹中。这不是一个理想的解决方案,但还行。当然,如果我将这个组件拆分为它自己的node_模块并从那里导入,Angular将足够智能,允许相对于node_模块的路径,对吗?到目前为止,那里也没有运气

那么,我们应该如何使用包含特定于该模块的图像的node_模块呢?我们现在的一个明显的解决办法是添加一个postinstall脚本,将图像从模块复制到依赖项目的资产文件夹中——但这似乎有点老套,需要我们假设他们有一个特定的资产文件夹设置

总之:

  • 是否有某种方法可以参照位于相对于该文件夹的零部件文件夹中的图像
  • 如果没有,是否有某种方法可以参考位于相对于
    节点模块的节点模块中的图像
  • 如果没有,设置和维护模块及其映像的最佳方式是什么?postinstall是解决问题的最佳方法吗
这件事让我绞尽脑汁,这是我第一次真正质疑Angular2和CLI。

基于webpack默认包含的设置,它将放弃对图像渲染的控制。您可以通过执行命令从Angular CLI弹出webpack来更改默认设置。完成此操作后,可以在webpack.config.js文件中引用图像