@absolunet/gulp-include 中文文档教程

Question

@absolunet/gulp-include

使包含文件变得轻而易举。 启用类似于 snockets / sprockets 或其他文件插入编译工具的功能。 （通过包含的自定义呈现扩展 gulp-include）

为 gulp 3 制作

Usage

首先，安装 gulp-include 作为开发依赖项： npm install --save-dev @absolunet/gulp-include

然后，将您的include-comments 添加到您的文件中。 使用过 sprockets 或 snockets 的人会有宾至如归的感觉。

include-comment 看起来像这样：

//= include relative/path/to/file.js

或如果你想变得疯狂，像这样的 glob 模式：

//= include relative/path/to/directory/*.js

或者更疯狂，类似于 GruntJS 中常用的数组 glob：（

//= include ['app/someFramework.js', 'app/**/*.js', '!app/vendor/**/*', 'app/someLibrary.js']

注意：对于那些不熟悉上述语法的人，请查看 https://github。 com/isaacs/节点-glob 或 http://gruntjs.com/configuring-tasks#globbing-patterns）

你可以用任何语言完成所有这些，唯一的要求是第一个字符 在任何#、/ 或空白字符之后的行上是一个等号。

#= require_tree relative/path/to/directory

gulp-include 忽略空格，只要注释行以 newline 开头，然后是 = 并包含 include , require 或 include_tree, require_tree。

这个插件递归地扩展它包含的文件，所以你可以嵌套包含在文件中 他们自己被包括在内。 IE:

main.js:

//= include included_file.js

included_file.js:

//= include recursive_include.js

以此类推递归到任意深度。

下面的示例将多个咖啡文件和 js 文件编译成一个 js 文件：

app.coffee：

`
//= require vendor/jquery.js
//= require vendor/modernizr.js
`

#= require controllers/AppController.coffee
#= require_tree views

class Main extends AppController
    constructor: ->
        console.log "This is main!"

window.main = new Main()

注意： 上面的示例使用反引号 (`) 允许gulp-coffee 编译内联 javascript

gulpfile.js：

var gulp        = require('gulp'),
    include     = require('@absolunet/gulp-include'),
    coffee      = require('gulp-coffee');

gulp.task("scripts", function() {
    gulp.src('src/js/app.coffee')
        .pipe( include() )
        .pipe( coffee() )
        .pipe( gulp.dest("dist/js") )
});

gulp.task("default", "scripts");

jshtml

//= jshtml relative/path/to/file

或者如果你想获取一个目录

//= jshtml_directory relative/path/to/directory

Example

下面的例子将几个 jsrender 文件编译成一个 js 文件：

app.js：

//= jshtml common/templates/item
//= jshtml_directory cart/templates

app.tmpl.common_item.render();
app.tmpl.cart_list1.render();

Options

• extensions (optional)
  • Takes a String or an Array of extensions, eg: "js" or ["js", "coffee"]
  • If set, all inclusions that does not match the extension(s) will be ignored
• basePath (optional)
  • Takes a String path
  • If set, all inclusions will be based from the basePath instead of being relative to the file
• autoExtension (optional)
  • Takes a Boolean
  • If set, all inclusions will automatically have the current file extension added to them
• partialPrefix (optional)
  • Takes a Boolean
  • If set, all inclusions will be tried with an underscore-prefixed filename (SASS style)
• fileProcess (optional)
  • Takes a Function
  • If set, will be called back with the file content to be processed an returned

Documentation

访问 http://absolunet.github.io/nwayo 网站了解所有内容。

Release history

分叉自 gulp-include v1.1.0

License

查看 许可证。