From fba8a48d9190c32e47ea800b94fc6724fab8e083 Mon Sep 17 00:00:00 2001 From: gconsidine Date: Fri, 8 Sep 2017 15:17:01 -0400 Subject: [PATCH] Update dependencies, template file, and docs * Use git+https prefix in git-based npm dependencies * Use ejs template for index to fix extraneous slash in path * Remove outdated documentation * Remove unused service * Regenerate shrinkwrap --- awx/ui/build/webpack.base.js | 6 +- awx/ui/build/webpack.watch.js | 3 +- awx/ui/client/features/credentials/index.js | 4 +- .../credentials/legacy.credentials.js | 6 +- ...index.template.html => index.template.ejs} | 6 + .../lib/services/base-string.service.js | 2 +- awx/ui/client/lib/services/index.js | 4 +- awx/ui/client/lib/services/path.service.js | 11 - awx/ui/npm-shrinkwrap.json | 622 ------------------ awx/ui/package.json | 20 +- awx/ui/templates/ui/index.html | 12 +- docs/ui_build_system.md | 237 ------- 12 files changed, 35 insertions(+), 898 deletions(-) rename awx/ui/client/{index.template.html => index.template.ejs} (97%) delete mode 100644 awx/ui/client/lib/services/path.service.js delete mode 100644 awx/ui/npm-shrinkwrap.json delete mode 100644 docs/ui_build_system.md diff --git a/awx/ui/build/webpack.base.js b/awx/ui/build/webpack.base.js index 461b30773a..e56cd0810d 100644 --- a/awx/ui/build/webpack.base.js +++ b/awx/ui/build/webpack.base.js @@ -23,7 +23,7 @@ const STATIC_PATH = path.join(UI_PATH, 'static'); const APP_ENTRY = path.join(SOURCE_PATH, 'app.js'); const VENDOR_ENTRY = path.join(SOURCE_PATH, 'vendor.js'); -const INDEX_ENTRY = path.join(CLIENT_PATH, 'index.template.html'); +const INDEX_ENTRY = path.join(CLIENT_PATH, 'index.template.ejs'); const INDEX_OUTPUT = path.join(UI_PATH, 'templates/ui/index.html'); const THEME_ENTRY = path.join(LIB_PATH, 'theme', 'index.less'); const OUTPUT = 'js/[name].[hash].js'; @@ -39,7 +39,7 @@ let base = { }, output: { path: STATIC_PATH, - publicPath: '{{ STATIC_URL }}', + publicPath: '', filename: OUTPUT }, module: { @@ -162,7 +162,7 @@ let base = { alwaysWriteToDisk: true, template: INDEX_ENTRY, filename: INDEX_OUTPUT, - inject: 'head', + inject: false, chunks: CHUNKS, chunksSortMode: (moduleA, moduleB) => { moduleA.files.sort((fileA, fileB) => fileA.includes('js') ? -1 : 1) diff --git a/awx/ui/build/webpack.watch.js b/awx/ui/build/webpack.watch.js index 44dfb785a5..b858dddede 100644 --- a/awx/ui/build/webpack.watch.js +++ b/awx/ui/build/webpack.watch.js @@ -7,7 +7,6 @@ const HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin'); const TARGET_PORT = _.get(process.env, 'npm_package_config_django_port', 8043); const TARGET_HOST = _.get(process.env, 'npm_package_config_django_host', 'https://localhost'); const TARGET = `https://${TARGET_HOST}:${TARGET_PORT}`; -const STATIC_URL = '/static/'; let development = require('./webpack.development'); @@ -18,8 +17,8 @@ let watch = { ], devServer: { contentBase: path.resolve(__dirname, '..', 'static'), - publicPath: STATIC_URL, clientLogLevel: 'info', + publicPath: '/static/', host: '127.0.0.1', port: 3000, proxy: { diff --git a/awx/ui/client/features/credentials/index.js b/awx/ui/client/features/credentials/index.js index d073454122..28266b8b82 100644 --- a/awx/ui/client/features/credentials/index.js +++ b/awx/ui/client/features/credentials/index.js @@ -53,8 +53,7 @@ CredentialsResolve.$inject = [ 'OrganizationModel' ]; -function CredentialsConfig ($stateExtenderProvider, legacyProvider, pathProvider, stringProvider) { - let path = pathProvider.$get(); +function CredentialsConfig ($stateExtenderProvider, legacyProvider, stringProvider) { let stateExtender = $stateExtenderProvider.$get(); let legacy = legacyProvider.$get(); let strings = stringProvider.$get(); @@ -116,7 +115,6 @@ function CredentialsConfig ($stateExtenderProvider, legacyProvider, pathProvider CredentialsConfig.$inject = [ '$stateExtenderProvider', 'LegacyCredentialsServiceProvider', - 'PathServiceProvider', 'CredentialsStringsProvider' ]; diff --git a/awx/ui/client/features/credentials/legacy.credentials.js b/awx/ui/client/features/credentials/legacy.credentials.js index bd363b0796..762ed96b88 100644 --- a/awx/ui/client/features/credentials/legacy.credentials.js +++ b/awx/ui/client/features/credentials/legacy.credentials.js @@ -7,7 +7,7 @@ import { N_ } from '../../src/i18n'; const indexTemplate = require('@features/credentials/index.view.html'); -function LegacyCredentialsService (pathService) { +function LegacyCredentialsService () { this.list = { name: 'credentials', route: '/credentials', @@ -363,8 +363,4 @@ function LegacyCredentialsService (pathService) { }; } -LegacyCredentialsService.$inject = [ - 'PathService' -]; - export default LegacyCredentialsService; diff --git a/awx/ui/client/index.template.html b/awx/ui/client/index.template.ejs similarity index 97% rename from awx/ui/client/index.template.html rename to awx/ui/client/index.template.ejs index 2778f45887..ff8f009b51 100644 --- a/awx/ui/client/index.template.html +++ b/awx/ui/client/index.template.ejs @@ -8,6 +8,12 @@ + <% htmlWebpackPlugin.files.css.forEach(file => {%> + + <% }) %> + <% htmlWebpackPlugin.files.js.forEach(file => {%> + + <% }) %> diff --git a/awx/ui/client/lib/services/base-string.service.js b/awx/ui/client/lib/services/base-string.service.js index 437cd10b2a..1ca71993a1 100644 --- a/awx/ui/client/lib/services/base-string.service.js +++ b/awx/ui/client/lib/services/base-string.service.js @@ -1,4 +1,4 @@ -import defaults from '../../assets/default.strings.json'; +import defaults from '@assets/default.strings.json'; let i18n; diff --git a/awx/ui/client/lib/services/index.js b/awx/ui/client/lib/services/index.js index 61f0a0e7dd..e314f89e99 100644 --- a/awx/ui/client/lib/services/index.js +++ b/awx/ui/client/lib/services/index.js @@ -1,6 +1,5 @@ import CacheService from '@services/cache.service'; import EventService from '@services/event.service'; -import PathService from '@services/path.service'; import BaseStringService from '@services/base-string.service'; import AppStrings from '@services/app.strings'; @@ -9,5 +8,4 @@ angular .service('AppStrings', AppStrings) .service('BaseStringService', BaseStringService) .service('CacheService', CacheService) - .service('EventService', EventService) - .service('PathService', PathService); + .service('EventService', EventService); diff --git a/awx/ui/client/lib/services/path.service.js b/awx/ui/client/lib/services/path.service.js deleted file mode 100644 index 9d41c25cc2..0000000000 --- a/awx/ui/client/lib/services/path.service.js +++ /dev/null @@ -1,11 +0,0 @@ -function PathService () { - this.getPartialPath = path => { - return `/static/partials/${path}.partial.html`; - }; - - this.getViewPath = path => { - return `/static/views/${path}.view.html`; - } -} - -export default PathService; diff --git a/awx/ui/npm-shrinkwrap.json b/awx/ui/npm-shrinkwrap.json deleted file mode 100644 index e523a05da3..0000000000 --- a/awx/ui/npm-shrinkwrap.json +++ /dev/null @@ -1,622 +0,0 @@ -{ - "name": "awx", - "version": "1.0.0", - "dependencies": { - "ajv": { - "version": "4.11.8", - "from": "ajv@>=4.9.1 <5.0.0", - "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz" - }, - "almond": { - "version": "0.3.3", - "from": "almond@>=0.3.1 <0.4.0", - "resolved": "https://registry.npmjs.org/almond/-/almond-0.3.3.tgz" - }, - "amdefine": { - "version": "1.0.1", - "from": "amdefine@>=0.0.4", - "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz" - }, - "angular": { - "version": "1.4.14", - "from": "angular@>=1.4.14 <1.5.0", - "resolved": "https://registry.npmjs.org/angular/-/angular-1.4.14.tgz" - }, - "angular-breadcrumb": { - "version": "0.4.1", - "from": "ansible/angular-breadcrumb#0.4.1", - "resolved": "git://github.com/ansible/angular-breadcrumb.git#6c2b1ad45ad5fbe7adf39af1ef3b294ca8e207a9" - }, - "angular-codemirror": { - "version": "1.0.4", - "from": "ansible/angular-codemirror#1.0.4", - "resolved": "git://github.com/ansible/angular-codemirror.git#75c3a2d0ccdf2e4c836fab7d7617d5db6c585c1b", - "dependencies": { - "angular": { - "version": "1.4.7", - "from": "angular@1.4.7", - "resolved": "https://registry.npmjs.org/angular/-/angular-1.4.7.tgz" - } - } - }, - "angular-cookies": { - "version": "1.4.14", - "from": "angular-cookies@>=1.4.14 <1.5.0", - "resolved": "https://registry.npmjs.org/angular-cookies/-/angular-cookies-1.4.14.tgz" - }, - "angular-drag-and-drop-lists": { - "version": "1.4.0", - "from": "ansible/angular-drag-and-drop-lists#1.4.0", - "resolved": "git://github.com/ansible/angular-drag-and-drop-lists.git#4d32654ab7159689a7767b9be8fc85f9812ca5a8" - }, - "angular-duration-format": { - "version": "1.0.1", - "from": "angular-duration-format@>=1.0.1 <2.0.0", - "resolved": "https://registry.npmjs.org/angular-duration-format/-/angular-duration-format-1.0.1.tgz" - }, - "angular-filters": { - "version": "1.1.2", - "from": "angular-filters@>=1.1.2 <2.0.0", - "resolved": "https://registry.npmjs.org/angular-filters/-/angular-filters-1.1.2.tgz" - }, - "angular-gettext": { - "version": "2.3.10", - "from": "angular-gettext@>=2.3.5 <3.0.0", - "resolved": "https://registry.npmjs.org/angular-gettext/-/angular-gettext-2.3.10.tgz" - }, - "angular-md5": { - "version": "0.1.10", - "from": "angular-md5@>=0.1.8 <0.2.0", - "resolved": "https://registry.npmjs.org/angular-md5/-/angular-md5-0.1.10.tgz" - }, - "angular-moment": { - "version": "0.10.3", - "from": "angular-moment@>=0.10.1 <0.11.0", - "resolved": "https://registry.npmjs.org/angular-moment/-/angular-moment-0.10.3.tgz" - }, - "angular-resource": { - "version": "1.4.14", - "from": "angular-resource@>=1.4.14 <1.5.0", - "resolved": "https://registry.npmjs.org/angular-resource/-/angular-resource-1.4.14.tgz" - }, - "angular-sanitize": { - "version": "1.4.14", - "from": "angular-sanitize@>=1.4.14 <1.5.0", - "resolved": "https://registry.npmjs.org/angular-sanitize/-/angular-sanitize-1.4.14.tgz" - }, - "angular-scheduler": { - "version": "0.1.0", - "from": "ansible/angular-scheduler#0.1.1", - "resolved": "git://github.com/ansible/angular-scheduler.git#9f2893a54c758b05bd6afce897488c01a6e8959d", - "dependencies": { - "angular-tz-extensions": { - "version": "0.3.11", - "from": "ansible/angular-tz-extensions", - "resolved": "git://github.com/ansible/angular-tz-extensions.git#33caaa9ccf5dfe29a95962c17c3c9e6b9775be35", - "dependencies": { - "angular": { - "version": "1.4.7", - "from": "angular@1.4.7", - "resolved": "https://registry.npmjs.org/angular/-/angular-1.4.7.tgz" - }, - "jquery": { - "version": "3.2.1", - "from": "jquery@>=3.1.0 <4.0.0", - "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.2.1.tgz" - } - } - } - } - }, - "angular-tz-extensions": { - "version": "0.3.11", - "from": "ansible/angular-tz-extensions#0.3.13", - "resolved": "git://github.com/ansible/angular-tz-extensions.git#33caaa9ccf5dfe29a95962c17c3c9e6b9775be35", - "dependencies": { - "angular": { - "version": "1.4.7", - "from": "angular@1.4.7", - "resolved": "https://registry.npmjs.org/angular/-/angular-1.4.7.tgz" - }, - "jquery": { - "version": "3.2.1", - "from": "jquery@>=3.1.0 <4.0.0", - "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.2.1.tgz" - } - } - }, - "angular-ui-router": { - "version": "1.0.0-beta.3", - "from": "angular-ui-router@1.0.0-beta.3", - "resolved": "https://registry.npmjs.org/angular-ui-router/-/angular-ui-router-1.0.0-beta.3.tgz" - }, - "argparse": { - "version": "1.0.9", - "from": "argparse@>=1.0.7 <2.0.0", - "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz", - "dependencies": { - "sprintf-js": { - "version": "1.0.3", - "from": "sprintf-js@>=1.0.2 <1.1.0", - "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz" - } - } - }, - "asn1": { - "version": "0.2.3", - "from": "asn1@>=0.2.3 <0.3.0", - "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz" - }, - "assert-plus": { - "version": "0.2.0", - "from": "assert-plus@>=0.2.0 <0.3.0", - "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz" - }, - "asynckit": { - "version": "0.4.0", - "from": "asynckit@>=0.4.0 <0.5.0", - "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz" - }, - "aws-sign2": { - "version": "0.6.0", - "from": "aws-sign2@>=0.6.0 <0.7.0", - "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz" - }, - "aws4": { - "version": "1.6.0", - "from": "aws4@>=1.2.1 <2.0.0", - "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz" - }, - "bcrypt-pbkdf": { - "version": "1.0.1", - "from": "bcrypt-pbkdf@>=1.0.0 <2.0.0", - "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz", - "optional": true - }, - "big.js": { - "version": "3.1.3", - "from": "big.js@>=3.1.3 <4.0.0", - "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz" - }, - "bindings": { - "version": "1.3.0", - "from": "bindings@>=1.2.1 <2.0.0", - "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.3.0.tgz" - }, - "boom": { - "version": "2.10.1", - "from": "boom@>=2.0.0 <3.0.0", - "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz" - }, - "bootstrap": { - "version": "3.3.7", - "from": "bootstrap@>=3.3.7 <4.0.0", - "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-3.3.7.tgz" - }, - "bootstrap-datepicker": { - "version": "1.7.1", - "from": "bootstrap-datepicker@>=1.7.1 <2.0.0", - "resolved": "https://registry.npmjs.org/bootstrap-datepicker/-/bootstrap-datepicker-1.7.1.tgz" - }, - "caseless": { - "version": "0.12.0", - "from": "caseless@>=0.12.0 <0.13.0", - "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz" - }, - "co": { - "version": "4.6.0", - "from": "co@>=4.6.0 <5.0.0", - "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz" - }, - "codemirror": { - "version": "5.29.0", - "from": "codemirror@>=5.17.0 <6.0.0", - "resolved": "https://registry.npmjs.org/codemirror/-/codemirror-5.29.0.tgz" - }, - "combined-stream": { - "version": "1.0.5", - "from": "combined-stream@>=1.0.5 <1.1.0", - "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz" - }, - "components-font-awesome": { - "version": "4.6.3", - "from": "components-font-awesome@>=4.6.1 <5.0.0", - "resolved": "https://registry.npmjs.org/components-font-awesome/-/components-font-awesome-4.6.3.tgz" - }, - "contextify": { - "version": "0.1.15", - "from": "contextify@>=0.1.5 <0.2.0", - "resolved": "https://registry.npmjs.org/contextify/-/contextify-0.1.15.tgz" - }, - "core-util-is": { - "version": "1.0.2", - "from": "core-util-is@1.0.2", - "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz" - }, - "cryptiles": { - "version": "2.0.5", - "from": "cryptiles@>=2.0.0 <3.0.0", - "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz" - }, - "cssom": { - "version": "0.2.5", - "from": "cssom@>=0.2.5 <0.3.0", - "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.2.5.tgz" - }, - "cssstyle": { - "version": "0.2.37", - "from": "cssstyle@>=0.2.3 <0.3.0", - "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-0.2.37.tgz", - "dependencies": { - "cssom": { - "version": "0.3.2", - "from": "cssom@>=0.3.0 <0.4.0", - "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.2.tgz" - } - } - }, - "d3": { - "version": "3.3.13", - "from": "d3@>=3.3.13 <3.4.0", - "resolved": "https://registry.npmjs.org/d3/-/d3-3.3.13.tgz" - }, - "dashdash": { - "version": "1.14.1", - "from": "dashdash@>=1.12.0 <2.0.0", - "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz", - "dependencies": { - "assert-plus": { - "version": "1.0.0", - "from": "assert-plus@>=1.0.0 <2.0.0", - "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz" - } - } - }, - "delayed-stream": { - "version": "1.0.0", - "from": "delayed-stream@>=1.0.0 <1.1.0", - "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz" - }, - "ecc-jsbn": { - "version": "0.1.1", - "from": "ecc-jsbn@>=0.1.1 <0.2.0", - "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz", - "optional": true - }, - "emojis-list": { - "version": "2.1.0", - "from": "emojis-list@>=2.0.0 <3.0.0", - "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz" - }, - "esprima": { - "version": "4.0.0", - "from": "esprima@>=4.0.0 <5.0.0", - "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz" - }, - "extend": { - "version": "3.0.1", - "from": "extend@>=3.0.0 <3.1.0", - "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz" - }, - "extsprintf": { - "version": "1.3.0", - "from": "extsprintf@1.3.0", - "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz" - }, - "forever-agent": { - "version": "0.6.1", - "from": "forever-agent@>=0.6.1 <0.7.0", - "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz" - }, - "form-data": { - "version": "2.1.4", - "from": "form-data@>=2.1.1 <2.2.0", - "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz" - }, - "getpass": { - "version": "0.1.7", - "from": "getpass@>=0.1.1 <0.2.0", - "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz", - "dependencies": { - "assert-plus": { - "version": "1.0.0", - "from": "assert-plus@>=1.0.0 <2.0.0", - "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz" - } - } - }, - "har-schema": { - "version": "1.0.5", - "from": "har-schema@>=1.0.5 <2.0.0", - "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz" - }, - "har-validator": { - "version": "4.2.1", - "from": "har-validator@>=4.2.1 <4.3.0", - "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz" - }, - "hawk": { - "version": "3.1.3", - "from": "hawk@>=3.1.3 <3.2.0", - "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz" - }, - "hoek": { - "version": "2.16.3", - "from": "hoek@>=2.0.0 <3.0.0", - "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz" - }, - "htmlparser": { - "version": "1.7.7", - "from": "htmlparser@>=1.0.0 <2.0.0", - "resolved": "https://registry.npmjs.org/htmlparser/-/htmlparser-1.7.7.tgz" - }, - "http-signature": { - "version": "1.1.1", - "from": "http-signature@>=1.1.0 <1.2.0", - "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz" - }, - "is-typedarray": { - "version": "1.0.0", - "from": "is-typedarray@>=1.0.0 <1.1.0", - "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz" - }, - "isstream": { - "version": "0.1.2", - "from": "isstream@>=0.1.2 <0.2.0", - "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz" - }, - "javascript-detect-element-resize": { - "version": "0.5.3", - "from": "javascript-detect-element-resize@>=0.5.3 <0.6.0", - "resolved": "https://registry.npmjs.org/javascript-detect-element-resize/-/javascript-detect-element-resize-0.5.3.tgz" - }, - "jquery": { - "version": "2.2.4", - "from": "jquery@>=2.2.4 <2.3.0", - "resolved": "https://registry.npmjs.org/jquery/-/jquery-2.2.4.tgz" - }, - "jquery-mousewheel": { - "version": "3.1.13", - "from": "jquery-mousewheel@>=3.1.13 <3.2.0", - "resolved": "https://registry.npmjs.org/jquery-mousewheel/-/jquery-mousewheel-3.1.13.tgz" - }, - "jquery-ui": { - "version": "1.10.5", - "from": "jquery-ui@>=1.10.5 <1.11.0", - "resolved": "https://registry.npmjs.org/jquery-ui/-/jquery-ui-1.10.5.tgz" - }, - "js-yaml": { - "version": "3.9.1", - "from": "js-yaml@>=3.2.7 <4.0.0", - "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.9.1.tgz" - }, - "jsbn": { - "version": "0.1.1", - "from": "jsbn@>=0.1.0 <0.2.0", - "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz", - "optional": true - }, - "jsdom": { - "version": "0.5.7", - "from": "jsdom@0.5.7", - "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-0.5.7.tgz" - }, - "json-schema": { - "version": "0.2.3", - "from": "json-schema@0.2.3", - "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz" - }, - "json-stable-stringify": { - "version": "1.0.1", - "from": "json-stable-stringify@>=1.0.1 <2.0.0", - "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz" - }, - "json-stringify-safe": { - "version": "5.0.1", - "from": "json-stringify-safe@>=5.0.1 <5.1.0", - "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz" - }, - "json5": { - "version": "0.5.1", - "from": "json5@>=0.5.0 <0.6.0", - "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz" - }, - "jsonify": { - "version": "0.0.0", - "from": "jsonify@>=0.0.0 <0.1.0", - "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz" - }, - "jsprim": { - "version": "1.4.1", - "from": "jsprim@>=1.2.2 <2.0.0", - "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz", - "dependencies": { - "assert-plus": { - "version": "1.0.0", - "from": "assert-plus@1.0.0", - "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz" - } - } - }, - "jstimezonedetect": { - "version": "1.0.5", - "from": "jstimezonedetect@1.0.5", - "resolved": "https://registry.npmjs.org/jstimezonedetect/-/jstimezonedetect-1.0.5.tgz" - }, - "legacy-loader": { - "version": "0.0.2", - "from": "legacy-loader@0.0.2", - "resolved": "https://registry.npmjs.org/legacy-loader/-/legacy-loader-0.0.2.tgz" - }, - "loader-utils": { - "version": "0.2.17", - "from": "loader-utils@>=0.2.6 <0.3.0", - "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz" - }, - "lodash": { - "version": "3.8.0", - "from": "lodash@>=3.8.0 <3.9.0", - "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.8.0.tgz" - }, - "lr-infinite-scroll": { - "version": "1.0.0", - "from": "lorenzofox3/lrInfiniteScroll", - "resolved": "git://github.com/lorenzofox3/lrInfiniteScroll.git#59d348bc5c18f164438d2a30f1fd79b333c3b649" - }, - "mime-db": { - "version": "1.30.0", - "from": "mime-db@>=1.30.0 <1.31.0", - "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.30.0.tgz" - }, - "mime-types": { - "version": "2.1.17", - "from": "mime-types@>=2.1.7 <2.2.0", - "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.17.tgz" - }, - "moment": { - "version": "2.10.6", - "from": "moment@>=2.10.0 <2.11.0", - "resolved": "https://registry.npmjs.org/moment/-/moment-2.10.6.tgz" - }, - "nan": { - "version": "2.7.0", - "from": "nan@>=2.1.0 <3.0.0", - "resolved": "https://registry.npmjs.org/nan/-/nan-2.7.0.tgz" - }, - "ng-toast": { - "version": "2.0.0", - "from": "ansible/ngToast#2.0.1", - "resolved": "git://github.com/ansible/ngToast.git#fea95bb34d27687e414619b4f72c11735d909f93" - }, - "nvd3": { - "version": "1.7.1", - "from": "ansible/nvd3#1.7.1", - "resolved": "git://github.com/ansible/nvd3.git#a28bcd494a1df0677be7cf2ebc0578f44eb21102" - }, - "nwmatcher": { - "version": "1.3.9", - "from": "nwmatcher@>=1.3.1 <1.4.0", - "resolved": "https://registry.npmjs.org/nwmatcher/-/nwmatcher-1.3.9.tgz" - }, - "oauth-sign": { - "version": "0.8.2", - "from": "oauth-sign@>=0.8.1 <0.9.0", - "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz" - }, - "object-assign": { - "version": "4.1.1", - "from": "object-assign@>=4.0.1 <5.0.0", - "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz" - }, - "performance-now": { - "version": "0.2.0", - "from": "performance-now@>=0.2.0 <0.3.0", - "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz" - }, - "punycode": { - "version": "1.4.1", - "from": "punycode@>=1.4.1 <2.0.0", - "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz" - }, - "qs": { - "version": "6.4.0", - "from": "qs@>=6.4.0 <6.5.0", - "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz" - }, - "reconnectingwebsocket": { - "version": "1.0.0", - "from": "reconnectingwebsocket@>=1.0.0 <2.0.0", - "resolved": "https://registry.npmjs.org/reconnectingwebsocket/-/reconnectingwebsocket-1.0.0.tgz" - }, - "request": { - "version": "2.81.0", - "from": "request@>=2.0.0 <3.0.0", - "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz" - }, - "rrule": { - "version": "2.2.0-dev", - "from": "jkbrzt/rrule#4ff63b2f8524fd6d5ba6e80db770953b5cd08a0c", - "resolved": "git://github.com/jkbrzt/rrule.git#4ff63b2f8524fd6d5ba6e80db770953b5cd08a0c" - }, - "safe-buffer": { - "version": "5.1.1", - "from": "safe-buffer@>=5.0.1 <6.0.0", - "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz" - }, - "select2": { - "version": "4.0.3", - "from": "select2@>=4.0.2 <5.0.0", - "resolved": "https://registry.npmjs.org/select2/-/select2-4.0.3.tgz" - }, - "sntp": { - "version": "1.0.9", - "from": "sntp@>=1.0.0 <2.0.0", - "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz" - }, - "source-map": { - "version": "0.3.0", - "from": "source-map@>=0.3.0 <0.4.0", - "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.3.0.tgz" - }, - "sprintf-js": { - "version": "1.1.1", - "from": "sprintf-js@>=1.0.3 <2.0.0", - "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.1.tgz" - }, - "sshpk": { - "version": "1.13.1", - "from": "sshpk@>=1.7.0 <2.0.0", - "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz", - "dependencies": { - "assert-plus": { - "version": "1.0.0", - "from": "assert-plus@>=1.0.0 <2.0.0", - "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz" - } - } - }, - "stringstream": { - "version": "0.0.5", - "from": "stringstream@>=0.0.4 <0.1.0", - "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz" - }, - "timezone-js": { - "version": "0.4.14", - "from": "ansible/timezone-js#0.4.14", - "resolved": "git://github.com/ansible/timezone-js.git#6937de14ce0c193961538bb5b3b12b7ef62a358f" - }, - "tough-cookie": { - "version": "2.3.2", - "from": "tough-cookie@>=2.3.0 <2.4.0", - "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz" - }, - "tunnel-agent": { - "version": "0.6.0", - "from": "tunnel-agent@>=0.6.0 <0.7.0", - "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz" - }, - "tweetnacl": { - "version": "0.14.5", - "from": "tweetnacl@>=0.14.0 <0.15.0", - "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz", - "optional": true - }, - "uuid": { - "version": "3.1.0", - "from": "uuid@>=3.0.0 <4.0.0", - "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.1.0.tgz" - }, - "verror": { - "version": "1.10.0", - "from": "verror@1.10.0", - "resolved": "https://registry.npmjs.org/verror/-/verror-1.10.0.tgz", - "dependencies": { - "assert-plus": { - "version": "1.0.0", - "from": "assert-plus@>=1.0.0 <2.0.0", - "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz" - } - } - } - } -} diff --git a/awx/ui/package.json b/awx/ui/package.json index 659c0c1e6a..162df7cc93 100644 --- a/awx/ui/package.json +++ b/awx/ui/package.json @@ -11,7 +11,7 @@ }, "engines": { "node": "^6.11.3", - "npm": "^3.10.3" + "npm": "^3.10.10" }, "scripts": { "ui-docker-machine": "ip=$(docker-machine ip $DOCKER_MACHINE_NAME); npm set ansible-tower:django_host ${ip}; grunt dev;", @@ -90,18 +90,18 @@ }, "dependencies": { "angular": "~1.4.14", - "angular-breadcrumb": "github:ansible/angular-breadcrumb#0.4.1", - "angular-codemirror": "github:ansible/angular-codemirror#1.0.4", + "angular-breadcrumb": "git+https://git@github.com/ansible/angular-breadcrumb#0.4.1", + "angular-codemirror": "git+https://git@github.com/ansible/angular-codemirror#1.0.4", "angular-cookies": "~1.4.14", - "angular-drag-and-drop-lists": "github:ansible/angular-drag-and-drop-lists#1.4.0", + "angular-drag-and-drop-lists": "git+https://git@github.com/ansible/angular-drag-and-drop-lists#1.4.0", "angular-duration-format": "^1.0.1", "angular-gettext": "^2.3.5", "angular-md5": "^0.1.8", "angular-moment": "^0.10.1", "angular-resource": "~1.4.14", "angular-sanitize": "~1.4.14", - "angular-scheduler": "github:ansible/angular-scheduler#0.1.1", - "angular-tz-extensions": "github:ansible/angular-tz-extensions#0.3.13", + "angular-scheduler": "git+https://git@github.com/ansible/angular-scheduler#0.1.1", + "angular-tz-extensions": "git+https://git@github.com/ansible/angular-tz-extensions#0.3.13", "angular-ui-router": "1.0.0-beta.3", "bootstrap": "^3.3.7", "bootstrap-datepicker": "^1.7.1", @@ -114,12 +114,12 @@ "js-yaml": "^3.2.7", "legacy-loader": "0.0.2", "lodash": "~3.8.0", - "lr-infinite-scroll": "github:lorenzofox3/lrInfiniteScroll", + "lr-infinite-scroll": "git+https://git@github.com/lorenzofox3/lrInfiniteScroll", "moment": "~2.10.0", - "ng-toast": "github:ansible/ngToast#2.0.1", - "nvd3": "github:ansible/nvd3#1.7.1", + "ng-toast": "git+https://git@github.com/ansible/ngToast#2.0.1", + "nvd3": "git+https://git@github.com/ansible/nvd3#1.7.1", "reconnectingwebsocket": "^1.0.0", - "rrule": "github:jkbrzt/rrule#4ff63b2f8524fd6d5ba6e80db770953b5cd08a0c", + "rrule": "git+https://git@github.com/jkbrzt/rrule#4ff63b2f8524fd6d5ba6e80db770953b5cd08a0c", "select2": "^4.0.2", "sprintf-js": "^1.0.3" } diff --git a/awx/ui/templates/ui/index.html b/awx/ui/templates/ui/index.html index 80623110d0..e58e03b78f 100644 --- a/awx/ui/templates/ui/index.html +++ b/awx/ui/templates/ui/index.html @@ -8,7 +8,17 @@ - + + + + + + + + + + + diff --git a/docs/ui_build_system.md b/docs/ui_build_system.md deleted file mode 100644 index 49238df093..0000000000 --- a/docs/ui_build_system.md +++ /dev/null @@ -1,237 +0,0 @@ -# UI BUILD SYSTEM - -### Table of Contents - -1. [Care and Keeping of NodeJS + NPM](#nodejs-and-npm) - 1. [Pin NodeJS & NPM versions](#pin-nodejs-npm-versions) - 2. [Use NVM to manage multple Node/NPM installations](#use-nvm) - 3.. [Add, incremenet, remove a package](#add-upgrade-remove-npm-package) - 4. [dependency, devDependency, or optionalDependency?](#npm-dependency-types) - -2. [Webpack](#webpack) - 1. [What does Webpack handle?](#webpack-what-do) - 2. [Add / remove a vendor module](#add-upgrade-remove-vendor-module) - 3. [Strategies: loading a module](#loading-modules) - 4. [Strategies: exposing a module to application code](#exposing-modules) - - -3. [Grunt](#grunt) - 1. [What does Grunt handle?](#grunt-what-do) - 2. [Add / remove a Grunt task](#add-remove-upgrade-grunt-task) - 3. [Task concurrency & process lifecycles](#grunt-task-concurrency) - -4. [Karma](#karma) - 1. [Developer configuration](#karma-developer-config) - 2. [CI configuration](#karma-ci-config) - -5. [Interfaces & Environments](#interfaces-and-environments) - 1. [NPM script targets](#npm-scripts) - 2. [Makefile targets](#make-targets) - 3. [NPM config variables](#npm-config-variables) - 4. [Other environment variables](#environment-variables) - -6. References / Resources - - -# Care and Keeping of NodeJS + NPM -## Pin NodeJS & NPM versions - -NodeJS began packaging their releases with a bundled version of NPM. Occasionally, the version of NPM that ships with a given NodeJS release can be unstable. For example, the v6 LTS of Node shipped with a version of NPM that introduced a regression that broke module installation for any package with platform-specific dependencies. - -For this reason, it's strongly advised to pin development environments, CI, and release pipelines to vetted releases of NodeJS + NPM. - -Pinned versions are best expressed through the engine field in `package.json`. - -```json - "engines": { - "node": "^6.3.1", - "npm": "=3.10.3" - } - ``` - -## Use NVM to manage multiple NodeJS + NPM installations - -A system installation of Node raises *many* challenges on a development or shared system: user permissions, shared (global) modules, and installation paths for multiple versions. `nvm` is a light executable that addresses all of these issues. In the context of Tower, we use nvm to quickly switch between versions of NodeJS + NPM. - -Version support per Tower release -3.0.* - NodeJS v0.12.17 & NPM v2.15.1 -3.1.* - NodeJS 6.3.1 * & NPM 3.10.3 - -* [nvm installation guide](https://github.com/creationix/nvm#installation) -* [additional shell integrations](https://github.com/creationix/nvm#deeper-shell-integration) - -```bash -$ nvm install 6.3 -$ nvm use 6.3 - -``` - -## Adding, incrementing, removing packages via NPM - -The Tower package utilizes an `npm-shrinkwrap.json` file to freeze dependency resolution. When `npm install` runs, it will prefer to resolve dependencies as frozen in the shrinkwrap file before it ingests versions in `package.json`. To update the shrinkwrap file with a new dependency, pass the `--save` argument e.g. `npm install fooify@1.2.3 --save`. - -*Do not run `npm shrinkwrap` when add/updating dependencies*. This will re-generate the entire conflict resolution tree, which will churn over time. Instead, depend on `--save`, `--save-dev` and `--save-optional` to create/update the shrinkwrapped package. - -## What's a dependency, devDependency, or optionalDependency - -`dependency` - Bundled in the Tower product. Customer-facing. -`devDependency` - Used in the development, build, and release pipelines -`optionalDependency` - Platform-specific dependencies, or dependencies which should not cause `npm install` to exit with an error if these modules fail to install. - -# Webpack - -## What does Webpack handle? - -Webpack ingests our vendor and application modules, and outputs bundled code optimized for development or production. Configuration lives in `webpack.config.js`. - -Webpack is a highly pluggable framework ([list of vetted plugins](https://webpack.github.io/docs/list-of-plugins.html)) We make use of the following plugins: - -* [ProvidePlugin](https://webpack.github.io/docs/list-of-plugins.html#provideplugin) - automatically loads and exports a module into specified namespace. A modular approach to loading modules that you would otherwise have to load into global namespace. Example: - -```javascript -// webpack.config.js -plugins: { - new webpack.ProvidePlugin({ - '$': 'jquery', - }) -} -``` - -```javascript -// some-application-module.js -// the following code: -$('.my-thingy').click(); - -// is transformed into: -var $ = require('jquery'); -$('.my-thingy').click(); -``` - -* [CommonChunksPlugin](https://webpack.github.io/docs/list-of-plugins.html#commonschunkplugin) - a [chunk](https://webpack.github.io/docs/code-splitting.html#chunk-content) is Webpack's unit of code-splitting. This plugin' chunk consolidation strategy helps us split our bundled vendor code from our bundled application code, which *dramatically reduces* rebuild and browser loading time in development. - -Currently, Tower is split into two output bundles: `tower.vendor.js` and `tower.js`. This would be the plugin configuration to update to additionally split application code into more portable components (example: for usage in the Insights UI). - -* [DefinePlugin](https://webpack.github.io/docs/list-of-plugins.html#defineplugin) - injects a module that behaves like a global constant, which can be defined/configured as compile time. Tower uses this plugin to allow command-line arguments passed in at build time to be consumed by application code. - -* [UglifyJSPlugin](https://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin) (production-only) - removes whitespace and minifies output. The mangle option can be used for an addiction layer of obfuscation, but it can also cause namespace issues. - -## Add / remove a vendor module - -First, [install the package via npm](#add-upgrade-remove-npm-package). If the package doesn't export its contents as a CommonJS, AMD, or SystemJS module you will need to [write a module loader](https://webpack.github.io/docs/how-to-write-a-loader.html). - -Not all packages correctly import their own dependencies. Some packages (notable: most jquery plugins) assume a certain dependency will already be in the global namespace. You will need to shim dependencies into these modules using Webpack's [export loader](https://webpack.github.io/docs/shimming-modules.html#exporting). - -To bundle a new dependency in `tower.vendor.js`, add it to the `vendorPkgs` array in `webpack.config.js`. - -## Strategies: loading a module - -Webpack ingests code through a concept called a `loader`. [What is a loader?, exactly?](http://webpack.github.io/docs/using-loaders.html#what-are-loaders) - -Loaders can be chained together to perform a complex series of transformations and exports, or used in isolation to target a specific module. - -The Webpack loaders used by Tower: - -[Babel loader](https://github.com/babel/babel-loader) - loads files matching a pattern -[imports loader](https://github.com/webpack/imports-loader) - shims dependency namespace, or constrains our own module loading strategies for this package (e.g. prefer to use CJS because AMD strategy is broken in package) - - - -# Grunt - -[Grunt](http://gruntjs.com/) is a modular task runner. Functionally, it serves the same purpose as a Makefile or set of bash scripts. Grunt helps normalize the interfaces between disparate pieces of tooling. For purposes of Tower, Grunt also simplifies managing the lifecycle of concurrent child processes. - -## What does Grunt handle?a> - -Grunt cleans up build artifacts, copies source files, lints, runs 18n text extraction & compilation, and transforms LESS to CSS. - -Other development-only Grunt tasks will poll for file changes, run tasks when a subset of files changes, and raise an instance of BrowserSync (reloads browser on built changes) proxied to an instance of the Django API, running in a native Docker container or container inside of a Docker Machine. - -Grunt internally uses minimatch [file globbing patterns](http://gruntjs.com/configuring-tasks#globbing-patterns) - -## Add / change / remove a Grunt task - -Grunt tasks live in `awx/ui/grunt-tasks/` and are organized in a file-per-plugin pattern. - -The plugin `load-grunt-configs` will automatically load and register tasks read from the configuration files in `awx/ui/grunt-tasks`. This reduces the amount of boilerplate required to write, load, register, each task configuration. - - -FEach task may be configured with a set of default option, plus additional targets that inherit or override defaults. For example, all tasks in `grunt-tasks/clean.js` run with `-f` or `--force` flag. `grunt-contrib-clean` - -```javascript -module.exports = { - options: { force: true }, - static: 'static/*', - coverage: 'coverage/*', - tmp: '../../tmp', - jshint: 'coverage/jshint.xml' -}; -``` - -## Grunt task concurrency - -By default, Grunt tasks are run in a series. [grunt-concurrent] is a plugin that allows us to parallelize certain tasks, to speed up the overall build process. - -Note: certain polling tasks *must always be run on a thread that remains alive*. For example, the `webpack` tasks interact with Webpack's API. Therefor when Webpack's `livereload` option is on, Grunt `webpack` tasks should be spawned in series prior to Grunt `watch` tasks. - -# Karma - -`karma.conf.js` is a generic configuration shared between developer and CI unit test runs. - -The base configuration is suitable for live development. Additional command-line arguments supplement this general config to suit CI systems. - -An [npm script](#npm-scripts) interface is provided to run either of these configurations: `npm test` (base) `npm test:ci` - -# Interfaces & Environments - -The UI build system is intended for use through [NPM scripts](https://docs.npmjs.com/misc/scripts). NPM scripts are preferable to just running `grunt sometask` because `npm run` will look for `node_modules/.bin` executables, allowing us to manage CI/release executable versions through `package.json`. You would otherwise have to append these to the executor's $PATH. - -`npm run` targets are run in a shell, which makes them a flexible way of mixing together Python, Ruby, Node, or other CLI tooling in a project. - -## Tower's NPM script targets - -Below is a reference of what each script target does in human language, and then what you can expect the script to execute. - -------- - -Builds a development version of the UI with a BrowserSync instance proxied to a Docker Machine -```bash -$ DOCKER_MACHINE_NAME=default npm run build-docker-machine -$ ip=$(docker-machine ip $DOCKER_MACHINE_NAME); npm set ansible-tower:django_host ${ip}; grunt dev; -``` - -Builds a development version of the UI with a BrowserSync instance proxied to a native Docker container -```bash -$ DOCKER_CID=1a2b3c4d5e npm run build-docker -$ ip=`docker inspect --format '{{ .NetworkSettings.IPAddress }}' $DOCkER_CID` | npm set config ansible-tower:django_host ${ip}; grunt dev; -``` - -Builds a development version of the UI. No filesystem polling. Re-run after each new revision. -```bash -$ npm run build-devel -``` - -Builds a production version of the UI. -```bash -$ npm run build-release -``` - -Launches unit test runners in assorted browsers. Alias for `npm run test` -```bash -$ npm test -``` - -Launches unit test runners headless in PhantomJS. Alias for `npm run test:ci` -```bash -$ npm test:ci -``` - -Extracts i18n string markers to a .pot template. -```bash -$ npm run pot -``` - -Builds i18n language files with regard to .pot. -```bash -$ npm run languages -``` -