experimenting with 'import' statements
authorBill Erickson <berickxx@gmail.com>
Thu, 4 Jan 2018 21:26:09 +0000 (16:26 -0500)
committerBill Erickson <berickxx@gmail.com>
Mon, 8 Jan 2018 20:22:32 +0000 (15:22 -0500)
Signed-off-by: Bill Erickson <berickxx@gmail.com>
Open-ILS/src/templates/staff/index.tt2
Open-ILS/web/js/ui/default/staff/app.js
Open-ILS/web/js/ui/default/staff/services/core.js
Open-ILS/web/js/ui/default/staff/webpack.config.js

index 803774f..a67472a 100644 (file)
@@ -6,7 +6,10 @@
 
 [% BLOCK APP_JS %]
 <!-- splash / login page app -->
+<!--
 <script src="[% ctx.media_prefix %]/js/ui/default/staff/app.js"></script>
+-->
+<script src="[% ctx.media_prefix %]/js/ui/default/staff/build/js/app.bundle.js"></script>
 [% END %]
 
 <div ng-view></div> 
index 167e238..26eee4a 100644 (file)
@@ -4,7 +4,14 @@
  * Splash Page
  */
 
-angular.module('egHome', ['ngRoute', 'ui.bootstrap', 'egCoreMod', 'egUiMod'])
+//import angular from 'angular';
+import angular from 'angular';
+import ngRoute from 'angular-route';
+import uiBootstrap from 'angular-ui-bootstrap';
+import egCoreMod from './services/core.js';
+import egUiMod from './services/ui.js';
+
+angular.module('egHome', [ngRoute, uiBootstrap, egCoreMod, egUiMod])
 
 .config(
        ['$routeProvider','$locationProvider',
index dcc077d..40055c4 100644 (file)
@@ -3,7 +3,7 @@
  * egCoreMod houses all of the services, etc. required by all pages
  * for basic functionality.
  */
-angular.module('egCoreMod', ['cfp.hotkeys', 'ngFileSaver', 'ngCookies', 'ngToast'])
+export default egCoreMod = angular.module('egCoreMod', ['cfp.hotkeys', 'ngFileSaver', 'ngCookies', 'ngToast'])
 
 .config(['ngToastProvider', function(ngToastProvider) {
   ngToastProvider.configure({
index 971f6f6..ea4f8dc 100644 (file)
@@ -1,5 +1,6 @@
 const path = require('path');
 const merge = require('webpack-merge');
+const webpack = require('webpack');
 const CleanWebpackPlugin = require('clean-webpack-plugin');
 const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
@@ -83,25 +84,23 @@ const coreJsFiles = [
   './services/lovefield.js'
 ];
 
-
-// 3rd-party (AKA vendor) JS files loaded on every page.  NOTE:
-// using the un-minified versions of each so we can apply consistent
-// minification via webpack and optionally build inline source maps.
+// 3rd-party (AKA vendor) JS files loaded on every page.
+// Webpack knows to look in ./node_modules/
 const vendorJsFiles = [
-  './node_modules/angular/angular.js',
-  './node_modules/angular-route/angular-route.js',
-  './node_modules/angular-ui-bootstrap/dist/ui-bootstrap-tpls.js',
-  './node_modules/angular-hotkeys/build/hotkeys.js',
-  './node_modules/angular-file-saver/dist/angular-file-saver.bundle.js',
-  './node_modules/angular-location-update/angular-location-update.js',
-  './node_modules/angular-animate/angular-animate.js',
-  './node_modules/angular-sanitize/angular-sanitize.js',
-  './node_modules/angular-cookies/angular-cookies.js',
-  './node_modules/ng-toast/dist/ngToast.js',
-  './node_modules/angular-tree-control/angular-tree-control.js',
-  './node_modules/iframe-resizer/js/iframeResizer.js',
-  './node_modules/angular-order-object-by/src/ng-order-object-by.js',
-  './node_modules/lovefield/dist/lovefield.js'
+  'angular',
+  'angular-route',
+  'angular-ui-bootstrap',
+  'angular-hotkeys',
+  'angular-file-saver',
+  'angular-location-update',
+  'angular-animate',
+  'angular-sanitize',
+  'angular-cookies',
+  'ng-toast',
+  'angular-tree-control',
+  'iframe-resizer',
+  'angular-order-object-by',
+  'lovefield'
 ];
 
 
@@ -109,18 +108,22 @@ let commmonOptions = {
   // As of today, we are only bundling common files.  Individual app.js
   // and optional service files are still imported via script tags.
   entry: {
+    app: './app.js',
     core: coreJsFiles,
     vendor: vendorJsFiles
   },
   plugins: [
     new CleanWebpackPlugin([buildPath]),
-    new CopyWebpackPlugin(directCopyFiles, {copyUnmodified: true})
+    new CopyWebpackPlugin(directCopyFiles, {copyUnmodified: true}),
+    new webpack.optimize.CommonsChunkPlugin({
+      names: ['core', 'vendor'], // ORDER MATTERS
+      minChunks: 2 // TODO: huh?
+    })
   ],
   output: {
     filename: 'js/[name].bundle.js',
     path: path.resolve(__dirname, buildPath)
   }
-
 };
 
 // improve debugging during development with inline source maps
@@ -132,7 +135,7 @@ let devOptions = {
     // TODO: Add other bundles as necessary, but leave the 'vendor'
     // bundle out, since we always want to minify that (it's big).
     new UglifyJSPlugin({
-      exclude: [/core/]
+      exclude: [/core/, /app/]
     })
   ],
   watchOptions: {