vue在css引入背景图片抱错：This relative module was not found:bg.png in ./node_modules/css-loader

参考：https://blog.csdn.net/qq_37078641/article/details/88288348在css引入背景图片background-image: url("../assets/image/mobile/bg.png");background-size: cover;抱错This relative module was not found:*...

普通网友

12686人浏览 · 2020-01-12 02:25:38

普通网友 · 2020-01-12 02:25:38 发布

参考：https://blog.csdn.net/qq_37078641/article/details/88288348

在css引入背景图片

background-image: url("../assets/image/mobile/bg.png");
background-size: cover;

抱错

This relative module was not found:

* ../assets/image/mobile/bg.png in ./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-7c5532b5","scoped":false,"hasInlineConfig":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/components/mobile/index.vue

改成：

background-image: url("~@/assets/image/mobile/bg.png");
background-size: cover;

~@的意思： @是webpack设置的路径名，代表的是src目录，可以在build / webpack.base.conf.js更改设置
在这里插入图片描述
~ 是相对于下面的文件路径的意思

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^