Javascript 在vue.js中寻址为css时编译失败

Javascript 在vue.js中寻址为css时编译失败,javascript,vue.js,Javascript,Vue.js,我想将我的图像设置为css文件,但它给出的错误表明编译失败,我是vue的新手 我试着从src获取相对地址 body{ background: url("@/image/background.png"); } 但这是错误的我未能编译反正我尝试了另一种方法,它表明我的错误未能再次编译 body{ background: url("../image/background.jpg"); } 整个错误是: Failed to compile. ./node_modules/css-loade

我想将我的图像设置为css文件,但它给出的错误表明编译失败,我是vue的新手

我试着从src获取相对地址

body{
  background: url("@/image/background.png");
}
但这是错误的我未能编译反正我尝试了另一种方法,它表明我的错误未能再次编译

body{
  background: url("../image/background.jpg");
}
整个错误是:

Failed to compile.

./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-7ba5bd90","scoped":false,"hasInlineConfig":false}!./node_modules/sass-loader/lib/loader.js?{"indentedSyntax":true,"sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/App.vue
Module not found: Error: Can't resolve '../image/background.jpg' in '/home/sina/WebstormProjects/landing-vue/src'
 @ ./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-7ba5bd90","scoped":false,"hasInlineConfig":false}!./node_modules/sass-loader/lib/loader.js?{"indentedSyntax":true,"sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/App.vue 7:65-99
 @ ./node_modules/vue-style-loader!./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-7ba5bd90","scoped":false,"hasInlineConfig":false}!./node_modules/sass-loader/lib/loader.js?{"indentedSyntax":true,"sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/App.vue
 @ ./src/App.vue
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8081 webpack/hot/dev-server ./src/main.js
我的css文件地址:

src/assets/stylesheet/style.scss
src/assets/image/background.jpg
我的图像文件地址:

src/assets/stylesheet/style.scss
src/assets/image/background.jpg

您的映像路径实际上不应该是:

body{
  background: url("@/assets/image/background.jpg");
}
您声明您的图像路径是
src/assets/image/background.jpg

@
src/
的别名,但您仍然需要进入
资产
文件夹

我还将
.png
更改为
.jpg
。请检查您的文件扩展名

如果
@
别名在
.scss
文件中不适用,只需尝试相对链接:

body{
  background: url("../image/background.jpg");
}

显然,您需要根据放置样式表的位置调整路径。

“它向我显示了一个错误”是不够的。请粘贴您得到的错误。@AKX完整错误已添加到postWell,您确定该路径上的图像确实存在该名称,包括大写/小写字母吗?@AKX是的,我有,并且webstorm在表示无法解析的地址下划线(红色)directory@AKX很抱歉怎么修复?我不小心把它贴错了。@根本不起作用!!