[html] Jade 대신 Express에서 HTML 사용

Program / 글쓴이

Node.JS와 함께 Express를 사용하는 동안 Jade를 제거하는 방법은 무엇입니까? 평범한 HTML을 사용하고 싶습니다. 다른 기사에서는 사람들이 현재 최신 버전에서 사용되지 않는 app.register ()를 권장하는 것을 보았습니다.

답변

다음과 같이 할 수 있습니다.

  1. ejs 설치 :

    npm install ejs

  2. app.js의 템플릿 엔진을 ejs로 설정

    // app.js
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');

  3. 이제 경로 파일에서 템플릿 변수를 할당 할 수 있습니다. 

    // ./routes/index.js
exports.index = function(req, res){
res.render('index', { title: 'ejs' });};

  4. 그런 다음 / views 디렉토리에 html보기를 만들 수 있습니다.

답변

Jade는 html 입력도 허용합니다.
순수한 HTML 제출을 시작하려면 줄 끝에 점을 추가하십시오.
그것이 당신을 위해 속임수를 쓰면 다음을 시도하십시오.

doctype html
html. // THAT DOT
    <body>
        <div>Hello, yes this is dog</div>
    </body>

추신-HTML을 닫을 필요가 없습니다.이 작업은 Jade가 자동으로 수행합니다.

답변

Express 3부터는 간단히 사용할 수 있습니다. response.sendFile

app.get('/', function (req, res) {
  res.sendfile(__dirname + '/index.html');
});)

에서 공식 특급 API 참조 :

res.sendfile(path, [options], [fn]])

주어진 경로에서 파일을 전송하십시오.

파일 이름 확장자에 따라 Content-Type 응답 헤더 필드의 기본값을 자동으로 설정합니다. 콜백 fn(err)은 전송이 완료되거나 오류가 발생할 때 호출됩니다.

경고

res.sendFilehttp 캐시 헤더를 통해 클라이언트 측 캐시를 제공하지만 서버 측에서 파일 내용을 캐시하지 않습니다. 위의 코드는 각 요청에서 디스크에 도달합니다 .

답변

제 생각에는 html 파일을 읽기 위해 ejs와 같은 큰 것을 사용하는 것은 약간 무겁습니다. 매우 간단한 html 파일 용 템플릿 엔진을 방금 작성했습니다. 파일은 다음과 같습니다.

var fs = require('fs');
module.exports = function(path, options, fn){
    var cacheLocation = path + ':html';
    if(typeof module.exports.cache[cacheLocation] === "string"){
        return fn(null, module.exports.cache[cacheLocation]);
    }
    fs.readFile(path, 'utf8', function(err, data){
        if(err) { return fn(err); }
        return fn(null, module.exports.cache[cacheLocation] = data);
    });
}
module.exports.cache = {};

나는 내 htmlEngine을 불렀고 그것을 사용하는 방법은 간단히 말하면 다음과 같습니다

app.engine('html', require('./htmlEngine'));
app.set('view engine', 'html');

답변

app.register()감가 상각되지 않았 app.engine()으며 Express 3 가 템플릿 엔진 처리 방식을 변경 한 이후 로 이름이 변경되었습니다 .

Express 2.x 템플릿 엔진 호환성에는 다음 모듈 내보내기가 필요합니다.

exports.compile = function(templateString, options) {
    return a Function;
};

Express 3.x 템플릿 엔진은 다음을 내 보내야합니다.

exports.__express = function(filename, options, callback) {
  callback(err, string);
};

템플릿 엔진이이 메서드를 노출하지 않는 경우 운이 좋지 않습니다.이 app.engine()메서드를 사용하면 모든 기능을 확장에 매핑 할 수 있습니다. 마크 다운 라이브러리가 있고 .md 파일을 렌더링하려고했지만이 라이브러리가 Express를 지원하지 않았다고 가정하면 app.engine()호출은 다음과 같을 수 있습니다.

var markdown = require('some-markdown-library');
var fs = require('fs');

app.engine('md', function(path, options, fn){
  fs.readFile(path, 'utf8', function(err, str){
    if (err) return fn(err);
    str = markdown.parse(str).toString();
    fn(null, str);
  });
});

‘일반’HTML을 사용할 수있는 템플릿 엔진을 찾고 있다면 매우 빠르기 때문에 doT를 권장 합니다.

물론 Express 3 뷰 모델은 뷰 캐싱을 사용자 (또는 템플릿 엔진)에게 맡깁니다. 프로덕션 환경에서는 모든 요청에 ​​대해 디스크 I / O를 수행하지 않도록 뷰를 메모리에 캐시 할 수 있습니다.

답변

어떤 템플릿이 HTML이지만 변수를 지원하는지 명시 적으로 EJS를 사용할 수 있습니다. 다음은 express에서 EJS를 사용하는 방법에 대한 좋은 자습서입니다.

http://robdodson.me/blog/2012/05/31/how-to-use-ejs-in-express/

답변

렌더 엔진이 jade 대신 html을 받아들이도록하려면 다음 단계를 따르십시오.

  1. 통합 및 swig 를 디렉토리에 설치 하십시오.

     npm install consolidate
 npm install swig

  2. app.js 파일에 다음 줄을 추가하십시오.

    var cons = require('consolidate');

// view engine setup
app.engine('html', cons.swig)
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', ‘html');

  3. 보기 템플릿을 “views”폴더 안에 .html로 추가합니다. 노드 서버를 다시 시작하고 브라우저에서 앱을 시작하십시오.

이것은 아무런 문제없이 html을 렌더링하지만 JADE를 배우면서 사용하는 것이 좋습니다. Jade는 놀라운 템플릿 엔진이며이를 배우면 더 나은 디자인 및 확장 성을 달성하는 데 도움이됩니다.