На основе AMD (requirejs) механизма, загружаются современные файлы JavaScript-кода, такие как CoffeeScript, React и ECMAScript 6. Они компилируются в реальном времени в формат JS и сохраняются в кэше HTML5 LocalStorage.
Название «any» объединяет значения «anytime» и «anything».
Существует три ветви:
Исходный код всех трёх ветвей одинаков, различия только в bower.json.
bower install require-any
// или вы используете только ES6
bower install require-any#babel
// или вы используете только CoffeeScript
bower install require-any#coffee
Основной файл require-any.js реализует следующие функции:
Библиотека поставляется с двумя трансляторами в реальном времени:
Обратите внимание, что coffee-react-transform не имеет файла bower.json, поэтому его исходный код включён в ветку coffee.
Процесс обработки включает следующие шаги:
Для установки выполните команду:
bower install require-any --save
Измените конфигурацию для require.js:
var rjsConfig = {
paths : {
'react' : 'bower_components/react/react',
'react-dom' : 'bower_components/react/react-dom',
'babel-standalone' : 'bower_components/babel-standalone/babel.min',
'coffee-script' : 'bower_components/coffee-script/extras/coffee-script',
// 'coffee-react' : 'src/transpiler/coffee-react',
// Укажите протокол загрузки, вы можете указать любое имя
'any' : 'dist/require-any-all.min',
// Ниже часть транслятора, если вы уверены, что используете имена transpiler-coffee или transpiler-babel, вам не нужно изменять, они уже включены в файл require-any-all.
// Транслятор CoffeeScript
// 'transpiler-coffee': 'dist/require-any-all.min',
// Babel транслятор
// 'transpiler-babel' : 'dist/require-any-all.min',
// Для указанных модулей пути также можно использовать any!test2.es6 для загрузки, действительно, AMD стандарт сделан очень хорошо.
'test2' : 'test/Test2'
},
// Обратите внимание, зарегистрируйте конфигурацию в config, это механизм стандарта AMD.
//
config: {
any: {
// Указать пространство хранения кэша
cacheKey: 'my-cache',
// Включить режим компиляции, если это режим компиляции, напрямую загрузить этот модуль js-файл
// any!test.jsx, когда build = true, будет загружаться test.js файл
build: false,
// Отображать ли информацию отладки
// Отладка изменена на поддержку уровня, > 1 будет выводить имя модуля и URL при каждой загрузке.
debug: 2,
// Объявить связанные плагины
plugins: {
coffee: 'transpiler-coffee',
es6: 'transpiler-babel'
},
// Добавить настройку режима
// Окончательное соответствие всё ещё основано на сопоставлении файлов суффиксов для поиска соответствующих параметров конфигурации режима.
patterns: [
{ regex: '.es6$', mode: 'i', onMatch: function(matches) {}, plugin: 'transpiler-babel' }
],
// Суффикс файла псевдоним, укажите, какой плагин использовать для обработки
ext: {
cjsx: 'coffee',
jsx: 'es6'
},
// Параметры суффикса преобразования (компиляции), суффикс имени файла в качестве ссылки.
// Если здесь указан суффикс jsx, параметры конфигурации jsx будут иметь приоритет.
// Если суффикс jsx не указан, будут использоваться параметры конфигурации es6.
options: {
es6: {
plugins: [
"transform-es2015-modules-amd",
"transform-es2015-block-scoping",
"transform-class-properties",
"transform-es2015-computed-properties"
]
}
}
}
}
};
rjsConfig.urlArgs = "version=" + (new Date()).valueOf();
requirejs.config(rjsConfig);
Пример использования кода:
requirejs(['any!test/hello.coffee', 'any!test/Table.cjsx', 'react', 'react-dom', 'any!test/Test.jsx', 'any!test/Error.jsx'], function(hello, Table, React, ReactDOM, Test, Error) {
ReactDOM.render(React.createElement(Table), document.getElementById('test1'));
ReactDOM.render(React.createElement(Test), document.getElementById('test2'));
});
Здесь, если config.any.build
равно true
, все запросы с префиксом any будут пропускать соответствующие имена файлов суффиксов и загружать файлы js этих модулей. Например, test/hello.js.
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )