현재 JS 웹 구성 요소에 대한 경로 가져 오기

다른 리소스 (특히 DOM에 추가하는 iframe의 경우 src의 경우)에서로드해야하는 JS 웹 구성 요소가 있지만이 구성 요소는 상대적 통로).현재 JS 웹 구성 요소에 대한 경로 가져 오기

이 리소스는 호출 페이지를 기준으로 지정해야합니다.이 리소스는 window.location에서 쉽게 얻을 수 있습니다.

그러나 src을 가리키는 파일은 실행중인 JS 파일과 관련이 있으며, 구성 요소이므로 어디 있는지 알 수 없습니다.

그래서 :

example.com/index.html 
    |__> {unknown path}/web-component.js 
    |__> {unknown path}/resource.html <-- I want to get this

는 그 구성 요소는 node_modules 또는 bower_components 또는 webpackOutput 어디든지에있을 수 있습니다,하지만, DOM은 그것이 실행 년대 페이지가 아닌,에서 제공되어 동일한 위치를 가리 키도록 요구를 생성 그것.

이 코드는 웹 구성 요소에있는 것으로 document.currentScript은 null이고 document.getElementsByTagName('script')은 구성 요소를 포함하지 않을 수 있습니다.

출처

2017-11-22 Keith

이 답변은 도움이 될 수 있습니다 : https://stackoverflow.com/questions/3133243/how-do-i-get-the-path-to-the-current-script-with-node-js – admcfajn

@admcfajn 건배, 하지만 그것은 node.js에 적용됩니다. 웹 환경에 있습니다. node.js 서버 측에서 파일을 편집하여 하드 코딩 된 경로를 가질 수는 있지만 최후의 수단입니다. – Keith

그래, 나는이 상황에 맞는 크기가 맞다고 생각하지 않는다. 아래 좋은 생각. 이 또한 도움이 될 수 있습니다. https://stackoverflow.com/questions/39410541/how-to-get-original-file-path-in-the-script-with-webpack 웹 환경에 있지만 노드로 프리 컴파일하면 맞습니까? – admcfajn

잠재적 인 해결책이 있지만 잠재적 인 브라우저 호환성과 성능 문제가 있습니다.

아이디어는 new Error().stack입니다. 실행 파일의 경로가 포함되어 있습니다. 이로드 더 나은 방법으로 답변을 환영 있도록

그래서 ...

그것은 스택의 형식에 의존

// Get stack string 
const stack = new Error().stack.split('at'); 

// Get the last entry 
const scriptPath = stack[stack.length - 1].trim(); 

// The component will share the path up to the last slash 
const componentPath = scriptPath.substring(0, scriptPath.lastIndexOf('/'));

는 스택의 내용 및 new Error()은 성능 문제가 발생하지!

출처

2017-11-22 15:30:57 Keith

현재 JS 웹 구성 요소에 대한 경로 가져 오기

답변

관련 문제