Manchmal kann die Ressourcendatei nach dem Packen des CSS-Referenzbilds nicht gefunden werden.

Dieses Mal werde ich Ihnen den Grund nennen, warum Ressourcendateien nach dem Packen von CSS-referenzierten Bildern nicht gefunden werden können. Welche Vorsichtsmaßnahmen gibt es, um das Problem zu lösen, dass Ressourcendateien nach dem Packen von CSS-referenzierten Bildern nicht gefunden werden? . Hier ist der eigentliche Kampf. Schauen wir uns den Fall an.

Verwenden Sie Vue, um Bildressourcen über CSS zu packen und zu referenzieren.

.img { 
  height: 500px; 
  width: 100%; 
  background: url("./assets/img/1.jpg") no-repeat; 
  background-size: 100%; 
 }

Die Auswirkung einer Hot-Aktualisierung der Entwicklungsumgebung ist wie folgt

Aber auf der Seite nach dem Packen wird ein Fehler gemeldet, dass die Ressource nicht gefunden werden kann.

Ich habe den Grund überprüft, nachdem das CSS das Bild importiert und dann gepackt hat. Der Style-Loader konnte seinen eigenen publicPath nicht festlegen, also habe ich das CSS von ExtrahierenTextPlugin.

if (options.extract) { 
   return ExtractTextPlugin.extract({ 
    use: loaders, 
    // css 引用图片打包问题 
    publicPath: '../../../', 
    fallback: 'vue-style-loader' 
   }) 
  } else { 
   return ['vue-style-loader'].concat(loaders) 
  }

Nach einmaligem Aufbau wurde kein Fehler gemeldet und die Anzeige war normal!

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website.

Empfohlene Lektüre:

Wie man mit dem Ausfall von Schriftarten und Bildressourcen nach der Vue-Verpackung umgeht

So lösen Sie das Problem Das Problem, dass das Webpack-Schriftartsymbol nicht angezeigt werden kann

Das obige ist der detaillierte Inhalt vonManchmal kann die Ressourcendatei nach dem Packen des CSS-Referenzbilds nicht gefunden werden.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!