From 601e70fbd0d26503a5ce9ca47c0017d394e19ad0 Mon Sep 17 00:00:00 2001 From: Alex Coles Date: Wed, 26 Nov 2014 15:12:00 +0100 Subject: [PATCH] Bundle all (Bower) dependencies with Webpack Build a separate bundle for "global" dependencies shared between the classic Rails application and Angular app. Signed-off-by: Alex Coles --- app/assets/javascripts/application.js.erb | 21 ++-------- app/assets/stylesheets/external.sass.erb | 8 ++-- config/application.rb | 11 ----- frontend/app/global.js | 50 +++++++++++++++++++++++ frontend/karma.conf.js | 7 +--- frontend/tests/integration/index.html | 8 +--- frontend/webpack.config.js | 8 ++-- 7 files changed, 65 insertions(+), 48 deletions(-) create mode 100644 frontend/app/global.js diff --git a/app/assets/javascripts/application.js.erb b/app/assets/javascripts/application.js.erb index d83bd05500..f2e1a98321 100644 --- a/app/assets/javascripts/application.js.erb +++ b/app/assets/javascripts/application.js.erb @@ -10,21 +10,10 @@ // WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD // GO AFTER THE REQUIRES BELOW. // -//= require jquery -//= require jquery-migrate/jquery-migrate -//= require jquery-ujs -//= require jquery-ui -//= require jquery-ui/ui/i18n/jquery.ui.datepicker-en-GB.js -//= require jquery-ui/ui/i18n/jquery.ui.datepicker-de.js -//= require momentjs -//= require momentjs/lang/en-gb.js -//= require momentjs/lang/de.js -//= require moment-timezone/moment-timezone.js -//= require moment-timezone/moment-timezone-data.js - -//= require jquery.atwho/dist/js/jquery.atwho.js -//= require Caret.js/src/jquery.caret.js -//= require jquery_noconflict + +//= require ./bundles/openproject-global + +//# require jquery_noconflict //= require prototype //= require effects //= require dragdrop @@ -33,8 +22,6 @@ //= require lib/jquery.colorcontrast //= require lib/jquery.trap -//= require select2 - //= require top_menu //= require action_menu //= require openproject diff --git a/app/assets/stylesheets/external.sass.erb b/app/assets/stylesheets/external.sass.erb index 882cf32b06..a8c81d342a 100644 --- a/app/assets/stylesheets/external.sass.erb +++ b/app/assets/stylesheets/external.sass.erb @@ -27,8 +27,8 @@ */ @import reset -@import css/jquery.atwho +//@import css/jquery.atwho -@import "<%= asset_path("select2/select2.css") %>" -@import "<%= asset_path("jquery-ui/themes/base/jquery-ui.css") %>" -@import "<%= asset_path("angular-busy/dist/angular-busy.css") %>" +//@import "<%= asset_path("select2/select2.css") %>" +//@import "<%= asset_path("jquery-ui/themes/base/jquery-ui.css") %>" +//@import "<%= asset_path("angular-busy/dist/angular-busy.css") %>" diff --git a/config/application.rb b/config/application.rb index 7f10f2f450..da135bab58 100644 --- a/config/application.rb +++ b/config/application.rb @@ -107,11 +107,6 @@ module OpenProject # Enable the asset pipeline config.assets.enabled = true - bower_assets_path = Rails.root.join(*%w(vendor assets components)) - config.assets.paths << bower_assets_path.join(*%w(select2)).to_s - config.assets.paths << bower_assets_path.join(*%w(jquery-ui themes base)).to_s - config.assets.paths << bower_assets_path.join(*%w(jquery.atwho dist)).to_s - # Whitelist assets to be precompiled. # # This is a workaround for an issue where the precompilation process will @@ -127,12 +122,6 @@ module OpenProject config.assets.precompile.unshift -> (path) { (extension = File.extname(path)).present? and extension.in?(precompile_whitelist) } - config.assets.precompile += %w( - jquery-ui/themes/base/jquery-ui.css - select2/select2.css - angular-busy/dist/angular-busy.css - angular-busy/angular-busy.html - ) # Enable escaping HTML in JSON. config.active_support.escape_html_entities_in_json = true diff --git a/frontend/app/global.js b/frontend/app/global.js new file mode 100644 index 0000000000..7a42b5b96d --- /dev/null +++ b/frontend/app/global.js @@ -0,0 +1,50 @@ +//-- copyright +// OpenProject is a project management system. +// Copyright (C) 2012-2014 the OpenProject Foundation (OPF) +// +// This program is free software; you can redistribute it and/or +// modify it under the terms of the GNU General Public License version 3. +// +// OpenProject is a fork of ChiliProject, which is a fork of Redmine. The copyright follows: +// Copyright (C) 2006-2013 Jean-Philippe Lang +// Copyright (C) 2010-2013 the ChiliProject Team +// +// This program is free software; you can redistribute it and/or +// modify it under the terms of the GNU General Public License +// as published by the Free Software Foundation; either version 2 +// of the License, or (at your option) any later version. +// +// This program is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU General Public License for more details. +// +// You should have received a copy of the GNU General Public License +// along with this program; if not, write to the Free Software +// Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. +// +// See doc/COPYRIGHT.rdoc for more details. +//++ + +// 'Global' dependencies +// +// dependencies required by classic (Rails) and Angular application. + +require('jquery'); +require('jquery-migrate/jquery-migrate'); +require('jquery-ujs'); +require('jquery-ui/ui/jquery-ui.js'); +require('jquery-ui/ui/i18n/jquery.ui.datepicker-en-GB.js'); +require('jquery-ui/ui/i18n/jquery.ui.datepicker-de.js'); + +require('momentjs'); +require('momentjs/lang/en-gb.js'); +require('momentjs/lang/de.js'); + +require('moment-timezone/moment-timezone.js'); +require('moment-timezone/moment-timezone-data.js'); + +require('jquery.atwho/dist/js/jquery.atwho.js'); +require('Caret.js/src/jquery.caret.js'); + +require('select2/select2.js'); diff --git a/frontend/karma.conf.js b/frontend/karma.conf.js index aaecc11afb..d666e5d4ca 100644 --- a/frontend/karma.conf.js +++ b/frontend/karma.conf.js @@ -48,12 +48,7 @@ module.exports = function(config) { // list of files / patterns to load in the browser files: [ - "bower_components/jquery/dist/jquery.js", - "bower_components/momentjs/moment.js", - "bower_components/moment-timezone/moment-timezone.js", - 'bower_components/select2/select2.js', - "../vendor/assets/javascripts/moment-timezone/moment-timezone-data.js", - + 'app/global.js', 'app/openproject-app.js', "bower_components/angular-mocks/angular-mocks.js", diff --git a/frontend/tests/integration/index.html b/frontend/tests/integration/index.html index 2750ecaccb..2c051a64c5 100644 --- a/frontend/tests/integration/index.html +++ b/frontend/tests/integration/index.html @@ -19,13 +19,7 @@ gon.settings = {}; - - - - - - - + diff --git a/frontend/webpack.config.js b/frontend/webpack.config.js index 3f77669848..192f665b3e 100644 --- a/frontend/webpack.config.js +++ b/frontend/webpack.config.js @@ -17,6 +17,7 @@ module.exports = { context: __dirname + '/app', entry: _.merge({ + 'global': './global.js', 'core-app': './openproject-app.js' }, pluginEntries), @@ -28,6 +29,8 @@ module.exports = { module: { loaders: [ { test: /[\/]angular\.js$/, loader: 'exports?angular' }, + { test: /[\/]jquery\.js$/, loader: 'expose?jQuery' }, + { test: /[\/]moment\.js$/, loader: 'expose?moment' }, { test: /[\/]vendor[\/]i18n\.js$/, loader: 'expose?I18n' }, { test: /js-[\w|-]{2,5}\.yml$/, loader: 'json!yaml' } ] @@ -38,7 +41,8 @@ module.exports = { modulesDirectories: [ 'node_modules', - 'bower_components' + 'bower_components', + 'vendor' ].concat(pathConfig.pluginDirectories), alias: _.merge({ @@ -58,8 +62,6 @@ module.exports = { root: __dirname + '/node_modules' }, - externals: { jquery: 'jQuery' }, - plugins: [ new webpack.ProvidePlugin({ '_': 'lodash',