我在 Vue 項目中的 CSS 不接受引用的 URL

Question

正如標題所說，當我將引用的 URL 傳遞給背景圖像或 cursor 時，它根本不會加載文件。
我使用 Vue 並安裝了以下庫：Vuetify、SASS、SASS-Loader、Node-SASS。
我無法卸載 Node-SASS，因為我的項目沒有它就無法運行。

這里有些例子：

// This works
#app {
  cursor: url(../public/graphics/Nights_Edge.png), auto;
}
// This doesn't work
#app {
  cursor: url('../public/graphics/Nights_Edge.png'), auto;
}
// This also doesn't work
#app {
  cursor: "url(../public/graphics/Nights_Edge.png)", auto;
}

我的后續問題是，如果引用的 URL 未加載，我如何將這樣的 URL 傳遞給 Javascript？
我試圖做什么：

document.getElementById("app").style.cursor = "url(../public/graphics/Nights_Edge.png) auto";

顯然，刪除引號會使我陷入一片紅色。

Answer 1

只是為了關閉這個帖子。
我還沒有找到如何解決這個問題的答案，但這個解決方法對我有用。

 document.getElementById("app").style.cursor = 'unset';

 body { cursor: url("./image.png"), auto; } #app { cursor: auto; }

ID“app”是身體的孩子。

Answer 2

您可以使用\字符轉義 javascript 語言中引號的語義。 這基本上意味着“轉義”引號僅被視為字符串中的"字符，而不是表示代碼中實際字符串的開頭和結尾。這允許您在引用的文本中添加引號：

document.getElementById("app").style.cursor = "url(\"../public/graphics/Nights_Edge.png\"), auto";