Ionic Build plugin
NOTE: It requires that all development to be done under src/
folder, instead of www/
folder.
This is an Ionic plugin to build source files. It performs the following operations:
- Preprocess
index.html
(see preprocess) - Read all
*.html
templates, lint and converts them to minified javascript files, using$templateCache.put(...)
- Transforms all
templateUrl: 'path/to/template.html'
intotemplateProvider:function($templateCache){return $templateCache.get('path/to/template.html')}
- Read all
.css
files fromindex.html
, minifies and concats them intoall.min.css
(minification is only done when -p flag is set or when -sc flag is set without -p flag) - In every
.css
, replaces../fonts/ionicons*
with${bowerrc path}/ionic/fonts/ionicons*
- In every
.css
, replaces../fonts/fontawesomeionicons*
with${bowerrc path}/components-font-awesome/fonts/fontawesome*
- In every
.css
, replaces../img/*
withimg/*
- Read all
.js
files fromindex.html
, lints, annotates, minifies and concats them intoall.min.js
(minification is only done when -p flag is set or when -sc flag is set without -p flag) - Skips minification in resources under bower modules and already minified ones
- Copies all resources from
src/
towww/
(images, etc) - Replaces all scripts in
index.html
between<!--startsrc-->
and<!--endsrc-->
with<script src="all.min.js?v=${new Date().getTime()}"></script>
- Replaces all links in
index.html
between<!--startcss-->
and<!--endcss-->
with<link href="all.min.css?v=${new Date().getTime()}" rel="stylesheet">
These tasks are executed every time a cordova prepare
, phonegap prepare
or ionic prepare
is executed.
When the command is phonegap serve
it copies all files from src/
to www/
without modifying them and watch for changes in src/
directory, so they are immediately populated to corresponding platform.
Options:
optionshelp = optionsh || optionshelp; // Help optionsproduction = optionsp || optionsprod || optionsproduction; // Production optionsdebug = optionsd || optionsdebug; // DEBUG optionsangularDebug = optionsad || options'angular-debug'; // ANGULAR_DEBUG optionsskipLint = optionssl || options'skip-lint'; // Skip lint optionsnoFailLint = optionsnf || options'no-fail-lint'; // Don't fail on javascript/html errors optionsskipComp = optionssc || options'skip-comp'; // Skip compression optionsverbose = optionsvb || optionsverb || optionsverbose; // Verbose optionsextendedReport = optionsxr || options'extended-report'; // Extended hint reports optionsskipAll = optionssa || options'skip-all'; // Extended hint reports optionspreprocessResources = optionsppr || options'preprocess-resources'; // Preprocess resources optionsskipComp = optionsproduction ? optionsskipComp : !optionsskipComp; optionsenv = optionsproduction ? 'production' : 'development'; optionsconcatResources = optionsproduction; optionsskipHtmlCompression = optionsskipHtmlCompression || optionsskipComp; optionsskipResCompression = optionsskipResCompression || optionsskipComp; optionsdest = optionsdest || 'build'; globalNODE_ENV = optionsenv; return context: NODE_ENV: optionsenv DEBUG: optionsdebug && optionsproduction || !optionsdebug && !optionsproduction ? true : undefined ANGULAR_DEBUG: optionsangularDebug && optionsproduction || !optionsangularDebug && !optionsproduction ? true : undefined ;
Context variables are used to preprocess index.html
.
This options can be used it like this:
$ cordova prepare browser -p --skip-lint -nf
Ionic:
When cordova serve ...
is executed, this plugin automatically detects it and watch for file changes. The problem with ionic run browser -l
is that it executes cordova run browser
untherneath, so no serve can be detected. In this case you can use the -w
or -watch
flags:
$ ionic run browser -l -w -nf