如果没有找到这个相关模块，我如何修复这个错误？
如果没有找到这个相关模块，我如何修复这个错误？
提问于 2020-12-04 21:04:54
我正在尝试将背景图像添加到我的应用程序中
#app {
background-image: url('./assets/cold-bg.jpg');
}，那么我得到了这个错误
* ./assets/cold-bg.jpg in ./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!./node_modules/vue-loader-v16/dist/stylePostLoader.js!./node_modules/postcss-loader/src??ref--6-oneOf-1-2!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/App.vue?vue&type=style&index=0&id=7ba5bd90&lang=css回答 1
Stack Overflow用户
发布于 2020-12-04 21:40:58
我很快修正了这个错误，我总是使用它来加载带有计算属性的图像，使用这种方法，JavaScript将为我获得正确的路径，不管我的组件是如何嵌套的。
例如。
computed: {
getImage() {
return "background-image:url(" + require("@/assets/cold-bg.jpg") + ")";
}然后，在模板中，您可以按以下方式使用它：
<template>
<div :style="getImage"></div>
</template>您可以注意到，我将@/转到图像src，它告诉vue编译器通过src文件夹查找。
您可以使用methods而不是计算属性，这将有助于加载作为参数传递的图像src。
例如。
methods: {
getImage(path) {
return "background-image:url(" + require("@/" + path) + ")";
}在模板中，将正确的路径传递给方法。
<template>
<div :style="getImage('assets/cold-bg.jpg')"></div>
</template>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65150725
复制相关文章
相似问题
腾讯云开发者
