Question

我正在开发Angular 4 / Angular CLI项目。

部署时Tomcat服务器上的文件夹结构。

tomcat/
------Webapp/
-----------assets/bgr.svg

WebApp文件夹

main.bundle.js

// module
exports.push([module.i, ".myimg{\r\n    background: url('/assets/bgr.svg') no-repeat center center fixed;\r\n    background-size: cover;\r\n}", ""]);

的index.html

<head>
  <meta charset="utf-8">
  <title>Cliskeleton</title>
  <base href="./">

base href是＆＃39; ./'因为我使用tomcat来部署我的应用程序。

angular.cli

 "assets": [
        "assets",
        "favicon.ico"
      ],

app.component.css

.myimg{
    background: url('~/assets/bgr.svg') no-repeat center center fixed;
}

我可以在这里使用相对路径（＆＃39; ../ assets / bgr.svg＆＃39;）。但相对路径捆绑图像并将其放在dist文件夹中，我有数百个图像，所以它使dist文件夹非常大。所以我不想使用相对路径。

我已经尝试了资产/ bgr.svg＆＃39;另外，但我得到如下错误。

ERROR in ./src/app/app.component.css
Module not found: Error: Can't resolve './assets/bgr.svg' in 'D:\Research\CLISkeleton\cliskeleton\src\app'
 @ ./src/app/app.component.css 6:61-88
 @ ./src/app/app.component.ts
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi webpack-dev-server/client?http://localhost:4300 ./src/main.ts

是否有任何方法可以将我的所有图片放入资产＆＃39;文件夹并引用它。

使用Angular CLI无法在tomcat服务器上加载图像而不进行映像绑定

0 个答案: