github: https://github.com/heekei/gulp-code-replace

用途

将代码中的置标替换成对应的文件内容。

示例

假设现在有一个项目，项目结构如下：

tmps
- body.html
- header.js
index.html

index.html 内容如下：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>gulp-code-replace</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
    {{body.html}}
    <script>{{header.js}}</script>
</body>
</html>

tmps/body.html 内容如下：

<main>
    hello, you got it!
</main>

tmps/header.js 内容如下：

(function () {
    console.log('gulp-code-replace')
})();

经过处理后：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>gulp-code-replace</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
    <main>
        hello, you got it!
    </main>
    <script>
        (function () {
            console.log('gulp-code-replace')
        })();
    </script>
</body>
</html>

gulp 示例：

var codeReplace = require('gulp-code-replace');
var gulp = require('gulp');

gulp.task('default', function () {
    gulp.src(['./**/*.*', '!tmps/**/*.*'])
        .pipe(codeReplace('./tmps')) //pass the template base path
        .pipe(gulp.dest('build'));
});

推一下自己的 gulp 插件处女作： gulp-code-replace

用途

示例