我在 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";