Question

使用Symfony 2.8.24和jQuery 3.2.1

现在谷歌搜索了一段时间，是的，有很多类似的案例，涉及使用相对路径进行资源加载，但是，我没有找到解释我需要的东西，所以SO：

我需要在与head文件相同的文件夹中包含（或加载或附加到css或其他内容）js文件（简而言之）我试图这样做（这是真正的问题）使用相对路径（相对于{{1> 真正的问题）文件，而不是js文件。

我真的不知道这是否可能，所以，你知道，IMPOSSIBLE是一个有效的答案。

此外，这一点的全部内容是可移植性，当然，我试图制作的这个插件使用几个css和js文件都位于插件文件夹结构内的不同文件夹中，我打算包含（或加载或附加到必要时html或者其他）。如果我能做到这一点，使得该过程无视插件的顶层文件夹被复制的位置，我不必每次在不同的项目中使用它时都改变绝对路径。

当前/不需要的状态：

head

见解和想法，对我而言！

Answer 1

一个棘手的技巧是使用Error.stack，它在当前的浏览器中受支持，但尚未标准化。

c1CssImport = function (location) { // todo: handle absolute urls
    const e = new Error();
    const calledFile = e.stack.split('\n')[2].match(/[a-z]+:[^:]+/);
    const calledUrl = new URL(calledFile);
    calledUrl.search = '';
    const target = new URL(location, calledUrl).toString();
    for (let el of document.querySelectorAll('link[rel=stylesheet]')) {
        if (el.href === target) return; // already loaded
    }
    const link = document.createElement('link');
    link.rel = 'stylesheet';
    link.href = target;
    document.head.append(link);
    // todo: return a promise
}

然后只需调用c1CssImport（），即可在其中包含基于相对URL的CSS文件：

c1CssImport('./ui.css');

注意：

您不需要jQuery
该脚本仅包含一次CSS
此脚本未处理绝对URL
我不知道其他域中包含的js文件是否可以处理此技术（未经测试）

对于js，我建议使用js模块

使用js文件

1 个答案: