어떻게 grunt 작업을 사용하여 html로 파일 목록을 생성합니까?

나는 yeoman, grunt 및 angularjs를 사용하고 있으며 grunt에 초보입니다.어떻게 grunt 작업을 사용하여 html로 파일 목록을 생성합니까?

나는 이미 dist 폴더에 복사 된 이와 같은 콘텐츠를 생성합니다.

/dist/whatever/x/a.html 
/dist/whatever/y/b.html 
/dist/whatever/x/c.html

나는 툴툴 거리는 소리 작업을 사용하여 다른 HTML 파일을 생성하고 싶습니다 :

/dist/whatever/index.html

포함

... 
<a href="x/a.html">x</x> 
<a href="y/b.html">x</x> 
<a href="x/c.html">x</x> 
...

이 HTML 파일을 템플릿으로 내/app 폴더에 존재 할 수 있습니다 일부 토큰을 꿀꺽 꿀꺽 마시고 대체하십시오.

패턴과 일치하는 파일을 찾고 기존 내용에 쓰는 기존 모듈이 있습니까? 매트의 의견에 따라

솔루션을 사용하는 꿀꿀 거리는 소리를-포함 소스 :

Gruntfile.js :

includeSource: { 
    options: { 
    basePath: 'dist/whatever', 
    baseUrl: '', 
    templates: { 
     html: { 
     link: '<li><a href="{filePath}">{filePath}</a></li>' 
     } 
    } 
    }, 
    whateverIndex: { 
    files: { 
     'dist/whatever/index.html': 'app/whatever/index.template.html' 
    } 
    } 
},

응용 프로그램/어떤/index.template.html

<ul> 
<!-- include: "type": "link", "files": "*/index.html" --> 
</ul>

출처

2014-05-01 Craig Celeste

[grunt-include-source] (https://github.com/jwvdiermen/grunt-include-source)는 css와 js에 대한 그런 종류의 일을하지만 앵커 태그를 삽입 할 것인지는 모르겠습니다. 그. 새로운 검색에 사용하기 시작하거나 좋은 용어 일 수 있습니다. –

그건 완벽 했어! 당신은 답을해야하고 그것을 받아 들일 것입니다. –

grunt-include-source은 HTML의 섹션을 작성하여 디렉토리의 css, js 및 HTML 파일을 참조하거나 글로브와 일치해라.

docs on github은 작업 구성 및 작동 방식에 대한 개요를 제공합니다.

또한이 질문에 대한 the answer은 조금 더 자세한 정보를 제공합니다.

출처

2014-05-01 17:18:23

어떻게 grunt 작업을 사용하여 html로 파일 목록을 생성합니까?

답변

관련 문제