grunt에서 js-static 설정

3664 단어
ejs-static github 주소:https://github.com/shaekuronen/grunt-ejs-static
Gruntfile.js에 js-static 추가:
ejs_static: require('./tasks/ejs_static')(grunt)
구성 방법 1:
ejs_static.js
module.exports=function(grunt){
  var config={
    dest: 'app/html',
    path_to_data: 'data/data.json',
    path_to_layouts: 'app/assets/html/',
    index_page: 'index',
    parent_dirs: false,
    underscores_to_dashes: true,
    file_extension: '.html'
  }
	return {
		preview: {
			options: config
		},
    release:{
			options: grunt.util._.merge({ }, config, {
          dest:'<%= yeoman.dist %>/html'
        })  
    }
	}	
}

data.json
{
  "index": {
    "meta": {
      "title": "Home",
      "description": "Compile static html from ejs templates",
      "keywords": "gruntplugin, ejs, static html, static site generator, templates, templating engine, template, embedded js"
    }
  },

  "about": {
    "path_to_layout": "app/assets/html/about.ejs",
    "meta": {
      "title": "About",
      "description": "Compile static html from ejs templates",
      "keywords": "gruntplugin, ejs, static html, static site generator, templates, templating engine, template, embedded js"
    }
  }
}

ejs 템플릿 페이지에서 인용 방법 (각 파일 이름에 대응하는meta): <% =meta.title %>
구성 방법 2:
ejs_static.js
module.exports=function(grunt){
  var config={
    dest: 'app/html',
    path_to_data: 'data/routes.json',
    path_to_layouts: 'app/assets/html/',
    index_page: 'index',
    parent_dirs: false,
    underscores_to_dashes: true,
    file_extension: '.html'
  }
	return {
		preview: {
			options: config
		},
    release:{
			options: grunt.util._.merge({ }, config, {
          dest:'<%= yeoman.dist %>/html'
        })  
    }
	}	
}

routes.json
{
  "home": {
    "path_to_layout": "app/assets/html/index.ejs",
    "path_to_data": [
      "data/global.json",
      {"data/meta.json": "home"}
    ]
  },
  "a": {
    "path_to_layout": "app/assets/html/about.ejs",
    "path_to_data": [
      "data/global.json",
      "data/a.json"
    ]
  },
  "b": {
    "path_to_layout": "app/assets/html/about.ejs",
    "path_to_data": "data/a.json"
  }
}

meta.json
{
  "home": {
    "title": "Grunt EJS Static | Home",
    "description": "The demo page for Grunt EJS Static",
    "keywords": "gruntplugin, ejs, static html, static site generator, templates, templating engine, template, embedded js"
  }
}

global.json
{
  "site_name": "Grunt EJS Static",
  "google_analytics": "XOXOXO"
}

a.json
{
    "title": "About",
    "description": "Compile static html from ejs templates",
    "keywords": "gruntplugin, ejs, static html, static site generator, templates, templating engine, template, embedded js"
}

ejs 템플릿 페이지에서 인용: <% = 글로벌.site_name%>   <%= meta.title%>    <%= a.title %>
주의: 글로벌.site_name의 글로벌은 해당 path_to_데이터가 불러온 json 파일 이름

좋은 웹페이지 즐겨찾기