背景图片 Sass、Css 和 Express

Question

为什么当我在 .s 中执行代码段时css:

.section-home{
 background-image: url(Yggdrasil.jpg);
 position: relative;
 min-height: 100vh;
 background-size: cover;
 background-position: center;
 display: flex;
 justify-content: center;
 align-items: center;
}

和我运行命令 yarn watch，在相关文件中。css 我有这个代码：

.section-home {
  background-image: url(/images/Yggdrasil.jpg?71322804ce7f3cec49ab9190e347b8a6);
  position: relative;
  min-height: 100vh;
  background-size: cover;
  background-position: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

Answer 1

我解决了。在文件 webpack.mix.js 中，我添加了这行代码：

mix.sass('resources/scss/app.scss', 'public/css/app.css').options({
    processCssUrls: false
});

因为我使用 laravel-mix。关注这个doc

背景图片 Sass、Css 和 Express

Background image Sass, Css and Express

css

sass

express

reactjs