2014-02-03 4 views
2

дал мне есть этот файла JavaScriptСобирают/рули: запускать пользовательские функции определены во внешних JS файл

SRC/JS/functions.js

(function() { 

    crc32 = function(str, crc) { 
    ... 
    }; 
})(); 

Этот файл является частью статического веб-сайта, и Я хочу использовать crc32() в шаблоне, например:

index.hbs

<script type="text/javascript" charset="utf-8"> 
    var crc_checksum = {{checksum solution}}; 
</script> 

Конечно, это нуждается в промежуточный помощник

helpers.js

Handlebars.registerHelper('checksum', function(value){ 
    this.checksum = return value; 
});  

Я не хочу, чтобы скопировать и вставить код CRC32 в помощника (как это будет дублировать код). Есть ли способ загрузки внешнего JS-файла в пространство имен помощника?

ответ

2

Вы можете создать свой файл crc32 в формате «node.js» и использовать browserify, чтобы использовать его на своем сайте. Существуют также другие способы сделать ваш объект crc32 доступным как на узле, так и в браузере. Тогда вы можете require его в хелперов файле ...

SRC/JS/functions.js

(function(exports) { 
    exports.crc32 = function (str, crc) { ... }; 
})(window || module.exports); 

helpers.js

var crc32 = require('./src/js/functions').crc32; 
Handlebars.registerHelper('checksum', function (value) { 
    return crc32(value); 
}); 
+0

это именно то, что я искал, спасибо. Вместо использования браузера (была бы еще одна зависимость) я использовал [этот метод] (http://caolanmcmahon.com/posts/writing_for_node_and_the_browser/) обмена кодом между узлом и браузером. – hansaplast

0

Конечно, при создании помощника просто следуйте тому же шаблону модуля, который вы бы использовали с любой другой библиотекой узлов.

Wrap помощник в module.exports.register функции:

module.exports.register = function (Handlebars, options, params) { 
    Handlebars.registerHelper('checksum', function(src) { 
    return require('your-checksum-lib')(src); 
    }); 
}; 

А затем убедитесь, что сказать Собирают где файл:

assemble: { 
    options: { 
    helpers: ['path/to/checksum.js'] 
    } 
} 

Или ... если помощник на самом деле модуль НПМ вы можете добавить его в devDependencies и keywords в package.json, и Assemble автоматически подберет его. например:

{ 
    "name": "foo", 
    "devDependencies": { 
    "handlebars-helper-checksum": "~0.1.0", 
    }, 
    "keywords": [ 
    "handlebars-helper-checksum" 
    ] 
} 

Однако, вы также можете просто сделать запрос или пиар для этого помощника на handlebars-helpers репо, и мы могли бы добавить его в библиотеку.

+0

спасибо Jon. Поскольку модуль не является модулем npm, я закончил использование require с относительным путем к js-файлу и добавил некоторый код, чтобы сделать его доступным как для браузера, так и для node.js. Есть ли какая-либо польза в том, что вы собираете сборку через 'options.helpers', где файл против этого требует относительного пути? – hansaplast

+1

@PhilippKeller, если у вас есть несколько вспомогательных файлов в папке типа './Src/helpers /', вы можете собрать сборку через 'options.helpers', чтобы загрузить их все. В этих помощниках вы можете «требовать» для своих других модулей ... 'assemble: {options: {helpers: ['./src/helpers/**/*.js']}}' – doowb

+0

yes, as @ doowb указывает, вы можете использовать шаблоны для уменьшения/глобуса, чтобы сразу загрузить всех ваших помощников. Вот пример проекта, который демонстрирует то, что мы описываем: https://github.com/assemble/buttons/blob/master/Gruntfile.js#L40 – jonschlinkert

Смежные вопросы