html 파일하고 js파일하고 어케 연동시킴 ?
<html>
<head>
<meta charset = "UTF-8">
<title>My first electron app<\title>
<head/>
<body>
<h1>Hello electron! </h1>
<form id="comment-form">
<input type="text" id="comment-input" placeholder="코멘트" />
<input type="submit" id="submit" value="입력" />
</form>
<ul id="comments"> </ul>
<script src="renderer.js"></script>
</body>
</html>
이런식으로 js 파일 뽑아냈는데 스크립트가 재생이 안됨
document.addEventListener("DOMContentLoaded". () => {
// submit 때의 동작 정의하기
document.getElementById("comment-form").onsubmit = () => {
//코멘트 입력(input 요소) 추출하기
const commentInput = document.getElementById("comment-input");
if (commentInput.value === "") {
//코멘트가 입력되지 않았다면 아무것도 하지 않기.
return false;
}
// 입력한 코멘트를 기반으로 li 요소 만들기
const newComment = document.createElement("li");
//생생한 li 요소를 DOM에 넣기
newComment.innerText = commentInput.value;
document.getElementById("comments").appendChild(newComment);
//코멘트를 입력한 input의 내용 지우기
commentInput.value = "";
return false;
};
});
그냥 html 사이트에 타이틀하고 버튼 그리고 텍스트창밖에없음
텍스트 입력하고 버튼 누르면 밑으로 덧글 달리듯이 달려야하는데 .
안드로이드박사
경로 못찾는거 아니냐
termite
file:///C:/Users/Game/electron_first_app/test1/src/renderer.js 이런식으로 주는거임 ?
syntaxError
스크립트 태그 상대주소로 바꿔봐 경로 못찾는 거 같은데
termite
file:///C:/Users/Game/electron_first_app/test1/src/renderer.js 이런식으로?
안드로이드박사
걍 __dirname 활용하면 되지
termite
join(__dirname,"renderer.js" 이거아님?
루비스타
안녕! 반가워 일렉트론을한다니 흑흑
디스코드 루비스타#4609 연락줘 일렉트론 아톰셀에서 막바꼇을때부터해왓는데 하는사람이읎어서 외로웠어
일단은 일렉트론 빌드를 거친 후 경로 부분을 어떻게 잡아주는지부터 봐야할거야
일렉트론 프로토콜을 변경해서 일렉트론 앱 디렉토리의 정적 파일을 가져오는 코드를 잠깐 첨부하자면
const WEB_FOLDER = 'web'
const PROTOCOL = 'file'
protocol.interceptFileProtocol(PROTOCOL, (req, cb) => {
let url = req.url.substr(PROTOCOL.length + 1)
url = path.join(__dirname, WEB_FOLDER, url)
url = path.normalize(url)
cb({ path: url })
})
mainWindow.loadURL(url.format({
pathname: 'index.html',
protocol: PROTOCOL + ':',
slashes: true
}))
인데
기본적으로 일렉트론은 웹뷰 방식이라 대부분 예제에서는 내부 프론트 서버를 돌리고 localhost:port 를 주소로 할당하여 사용할테니 별 문제가 없겠지만, 완전한 정적 파일배포를 통해서 서비스 할때에는 프로토콜 옵션을 주는게 맞을거야 이후 콘솔로 여러가지 찍어보면서 보면 될꺼임
그리고 항상 주의해야할게 외부 스크립트의 적용인데, 일렉트론 패키징 과정에서 asar압축시 제대로 로딩되지 않는 버그가 있으니 항상 테스팅하면서 해봐