꼬치 모드를 사용하는 방법?

19

나는 현재 Emacs에서 꼬치 모드를 사용하기 위해 고심하고 있습니다.

MELPA를 통해 꼬치 모드를 다운로드하여 설치 했으므로 모든 종속성이 제자리에 있어야합니다.

테스트 목적으로 boidsjs 데모를 다운로드하기도했습니다 .

열고을 boids.js입력 한 다음 M-xrun-skewer(URL로 브라우저를 엽니 다 http://127.0.0.1:8080/skewer/demo) 마지막으로 M-xskewer-mode(-> 꼬치 모드 사용)을 실행합니다.

그러나 브라우저에서는 아무 일도 일어나지 않습니다 .

내가 도대체 뭘 잘못하고있는 겁니까?

package skewer-mode javascript

— JacksGT
소스

내가 이해하는 것처럼 꼬치는 자바 스크립트 평가를위한 인터페이스를 제공합니다 ... 실제로 버퍼 의 내용을 평가boids.js 합니까?

— T. Verron

<kbd> Cx Ck </ kbd> ( "boid.js loaded")로 현재 버퍼를로드하고 <kbd> Cx Ce </ kbd>로 평가하려고합니다. 그러나 "$"기호를 구문 분석 할 수 없다는 오류가 발생합니다. 해당 HTML 파일 (example.html)에서 jQuery를로드하지 않았기 때문입니다.

— JacksGT

2

skewer-html-mode에서 html 파일을 평가해야합니다.

— Jordon Biondo

어떻게? C-x C-k작동하지 않음skewer-html-mode

— JacksGT

16

TLDR; http 서버 ( simple-http ) 를 시작하고 이를 통해 HTML 파일을로드해야합니다.

예를 들어, 당신이라는 이름의 HTML 파일이 있다고 가정하자 hello.html라는 이름의 JS 스크립트 파일 script.js에 /home/user/Documents/javascript폴더에 있습니다.

hello.html :

<!doctype html>
<html>
<head>
    <!-- Include skewer.js as a script -->
    <script src="http://localhost:8080/skewer"></script>
    <!-- Include my script.js file -->
    <script src="script.js"></script>
</head>
<body>
    <p>Hello world</p>
</body>
</html>

script.js :

alert('hey!');

init.el (또는 .emacs ) :

(require 'simple-httpd)
;; set root folder for httpd server
(setq httpd-root "/home/user/Documents/javascript")

이제 서버를 시작해야합니다. 를 방문하여 브라우저 M-x httpd-start에서 index.html파일을여십시오 http://localhost:8080/hello.html. 브라우저에서 경고를 받고 이제 전화하십시오 skwer-repl.

repl을 통해 브라우저와 추가로 상호 작용할 수 있습니다. 따라서 repl에서 평가 한 모든 내용이 브라우저로 전송됩니다. 예를 들어 console.log('hey!')repl 을 입력 하면 브라우저 콘솔에이 메시지가 표시됩니다.

대화식으로 HTML (예 : emacs의 라이브 업데이트 HTML 태그)을 수정하려면 init.el 또는 .emacs에 추가하십시오 .

(add-hook 'html-mode-hook 'skewer-html-mode)

이제 .html 파일에 있으면 C-M-x( skewer-html-eval-tag)로 태그를 평가할 수 있으며 브라우저에서 즉시 업데이트됩니다.

반대로 이는 CSS 및 CSS 파일에도 적용됩니다.

— 가이사
소스

1

게시 해 주셔서 감사합니다. 아마도 httpd-root설정에서 하드 코딩을 원하지 않으면 M-x eval-expression (setq httpd-root "/path/to/files")언제든지 emacs 내에서 실행할 수 있다는 점도 가치가 없습니다 .

— Cody Reichert

html 예에서 쓸모없는 '\' <script src="http://localhost:8080/skewer"></script>\ (편집 할 수 없음-편집은> = 6 자 여야 함)

— kai-dj

8

데모를 실행하는 대신이 최소 단계 만 수행하면 모든 것이 올바르게 작동합니다.

이름이 myskewer.js 인 새 버퍼를 엽니 다.
JS2 모드 사용 (꼬치의 종속성)
꼬치 모드 사용
M-xrun-skewer (브라우저가 열리고 myskewer.js로 돌아갑니다)
해당 줄의 끝을 입력 alert("hello");하고 누르십시오C-xC-e
브라우저로 돌아갑니다.

페이지에 경고 상자가 나타납니다.

— 감보
소스

답변 주셔서 감사합니다! 불행히도 "포인트에서 접을 수있는 요소를 찾을 수 없습니다"라는 오류 메시지가 표시됩니다.

— JacksGT

미안, 내 실수 C-x C-e실제로 밀 수있는 키입니다. 내 답변을 편집합니다

— Gambo

작동했습니다! 그러나 Skewer에게 HTML을로드하도록 어떻게 지시합니까? (데모에서 볼 수 있듯이)

— JacksGT

1

@JacksGT 다운로드 한 파일을 ~/public_html넣은 다음 이 링크의 "수동 버전"지침을 따르십시오 . 완료되면 브라우저에서 localhost : 8080 을 방문하십시오 .

— Gambo

1

경우 8080 포트가 이미 사용 중입니다 :

httpd-port변수 를 사용자 정의하여 다른 포트를 사용하도록 꼬치 / 간단한 httpd를 구성 할 수 있습니다 . ( M-x customize-variable<ret>httpd-port)

— 서브 인크
소스