Друзья, не так давно вышел очередной релиз фреймворка с открытым исходным кодом.
Апач Кордова , подробности можно найти в объявление .
Спешу поделиться подробностями одной из интересных функций, которая не так очевидна и продвигается в релизе, но значительно упрощает жизнь разработчикам плагинов для Apache Cordova, предоставляя им практически неограниченное поле для деятельности.
Прошу любить и жаловать:
Ниже я покажу, как вы можете использовать эту функцию для написания отладчика JavaScript для Windows Phone в качестве плагина для Apache Cordova. Результат вы можете увидеть на видео ниже (смотреть с включенным режимом HD)CB-6481 Add unified hooks support for cordova app and plugins
Что такое хуки Apache Cordova?
Лишь немногие разработчики приложений, использующие Apache Cordova, знают о крючки , но они существуют, и даже очень давно.Это специальные сценарии, которые программист может добавить, чтобы расширить или изменить стандартное поведение платформы.
С выходом версии 4.0 этот функционал был значительно расширен, унифицирован и стал доступен разработчикам плагинов .
Все подробности использования хуков можно найти здесь .
Зачем это вообще может понадобиться? Все API Apache Cordova JavaScript являются плагинами (основными или сторонними).
Модуль plugman, отвечающий за плагины, поддерживает довольно ограниченный список элементов, которые вы можете включить в плагин, например, добавив необходимую нативную dll или какие-то дополнительные файлы с нативным кодом.
Но при разработке сложных плагинов вы столкнетесь с проблемой, заключающейся в том, что вам нужно создать что-то, чего еще нет. Например, однажды, работая над Плагин веб-SQL нам нужна была поддержка дополнительного параметра cmd, так как мы не могли собрать для AnyCPU из-за зависимостей C++ и использовали недокументированные хаки, дыры в реализации и молились, чтобы это продолжало работать.
Теперь вы можете официально добавлять дополнительные скрипты (nodejs или любой другой исполняемый файл) для программирования дополнительной необходимой логики.
Так же npm-скрипты .
Отладчик JavaScript для Windows Phone 8
Чтобы увидеть, как работают хуки и показать их мощь, мы создадим плагин для отладки JavaScript на Windows Phone 8. Вы можете просмотреть весь исходный код плагина здесь .1. Создайте новый плагин и установите отладчик JavaScript с открытым исходным кодом.
Аардвольф внутри.
При этом наш плагин.
xml практически пуст. <plugin xmlns=" http://apache.org/cordova/ns/plugins/1.0 "
xmlns:android="http://schemas.android.com/apk/res/android "
xmlns:rim="http://www.blackberry.com/ns/widgets "
id="org.apache.cordova.debug.wp8"
version="0.0.1-dev">
<name>WP8 Debugger</name>
<description>Cordova WP8 Debugger Plugin</description>
<license>Apache 2.0</license>
<keywords>cordova,debug, wp8</keywords>
<repo></repo>
<issue></issue>
</plugin>
2. Добавьте скрипты (хуки) для платформы Windows Phone 8, которые будут выполняться во время сборки (pre_package) и после запуска приложения (after_run):
плагин.
xml <platform name="wp8">
<hook type="pre_package" src="scripts/injectDebugger.js" />
<hook type="after_run" src="scripts/startDebugServer.js" />
</platform>
3. Реализуем функционал кастомных скриптов
scripts/injectDebugger.js — скрывает исходные файлы JavaScript и перемещает их в специальное место, чтобы Aardwolf мог их распознать.
Чтобы не перетаскивать и динамически включать aardwolf.js в нужный html-файл, пишем его содержимое напрямую в cordova.js. module.exports = function(ctx) {
if(ctx.cmdLine.indexOf('--debug') <= 0) {
// debugger should run in debug mode only
return;
}
console.log('WP8Debugger: preparing js files for debugging.');
var serverRoot = path.join(ctx.opts.plugin.dir, 'Aardwolf');
var serverWwwCopyDir = path.join(serverRoot, 'files/www');
var platformRoot = path.join(ctx.opts.projectRoot, 'platforms/wp8');
console.log('Copy original www content');
if (fs.existsSync(serverWwwCopyDir)) {
shell.rm('-rf', serverWwwCopyDir)
}
shell.cp('-rf', path.join(platformRoot, 'www/*'), serverWwwCopyDir);
console.log('Rewriting js files');
rewriteFilesInDir(platformRoot, path.join(platformRoot, 'www'));
console.log('config: ' + JSON.stringify(config));
console.log('inject Aardwolf to cordova.js');
var content = 'window.AardwolfServerUrl = "http://' + config.serverHost + ':' + config.serverPort + '";';
content += fs.readFileSync(path.join(serverRoot, 'js/aardwolf.js')).
toString(); content += fs.readFileSync(path.join(platformRoot, 'www/cordova.js')).
toString();
fs.writeFileSync(path.join(platformRoot, 'www/cordova.js'), content);
console.log('WP8Debugger: done!');
}
scripts/startDebugServer.js — единственная задача этого скрипта — вовремя запустить сервер Aardwolf вместе с самим приложением.
module.exports = function(ctx) {
if(ctx.cmdLine.indexOf('--debug') <= 0) {
// debugger should run in debug mode only
return;
}
console.log('WP8Debugger: launching debug server.');
console.log('WP8Debugger: debug server host:' + config.serverHost);
var serverRoot = path.join(ctx.opts.plugin.dir, 'Aardwolf');
shell.exec("explorer " + '"http://' + config.serverHost + ':' + config.serverPort + '"');
var cmdLine = 'node ' + path.join(serverRoot, 'app.js') + ' -h ' + config.serverHost;
console.log(cmdLine);
shell.exec(cmdLine);
}
Давайте запустим
1. Установите Apache Кордова npm install -g cordova
2. Создайте заявку
cordova create testApp
cd testApp
3. Добавьте наш плагин
cordova plugin add location-of-cordova-debug-wp8
4. Запуск
cordova run wp8 --debug
Полезные ссылки
- Узнайте больше об Apache Cordova
- Все подробности о крючках Apache Cordova
- Весь исходный код плагина
- Посмотреть пример использования плагина
-
Секреты 3D-Cad-Дизайнера
19 Oct, 24 -
Хаброреклама - Комментарии К Баннерам
19 Oct, 24 -
Amd Brook+: Сразу С Места В Карьер
19 Oct, 24 -
Мусор Может Повлиять.
19 Oct, 24 -
Cnews Открывает Офис В Санкт-Петербурге
19 Oct, 24
