Skip to content

E
edx-platform
Commit 0b90c60b by Andy Armstrong Committed by GitHub
Options

Merge pull request #15301 from edx/andya/webpack-jquery 

Handle issues with JQuery in Studio and LMS
parents 626f015a 4ed9776a
Showing with 155 additions and 114 deletions
cms/envs/common.py
......@@ -600,7 +600,13 @@ STATICFILES_FINDERS = [
# Don't use compression by default
PIPELINE_CSS_COMPRESSOR = None
PIPELINE_JS_COMPRESSOR = None
PIPELINE_JS_COMPRESSOR = 'pipeline.compressors.uglifyjs.UglifyJSCompressor'
# Don't wrap JavaScript as there is code that depends upon updating the global namespace
PIPELINE_DISABLE_WRAPPER = True
# Specify the UglifyJS binary to use
PIPELINE_UGLIFYJS_BINARY = 'node_modules/.bin/uglifyjs'
from openedx.core.lib.rooted_paths import rooted_glob
......@@ -675,9 +681,34 @@ PIPELINE_CSS = {
},
}
base_vendor_js = [
'js/src/utility.js',
'js/src/logger.js',
'common/js/vendor/jquery.js',
'common/js/vendor/jquery-migrate.js',
'js/vendor/jquery.cookie.js',
'js/vendor/url.min.js',
'common/js/vendor/underscore.js',
'common/js/vendor/underscore.string.js',
'common/js/vendor/backbone.js',
'js/vendor/URI.min.js',
# Make some edX UI Toolkit utilities available in the global "edx" namespace
'edx-ui-toolkit/js/utils/global-loader.js',
'edx-ui-toolkit/js/utils/string-utils.js',
'edx-ui-toolkit/js/utils/html-utils.js',
# Finally load RequireJS
'common/js/vendor/require.js'
]
# test_order: Determines the position of this chunk of javascript on
# the jasmine test page
PIPELINE_JS = {
'base_vendor': {
'source_filenames': base_vendor_js,
'output_filename': 'js/cms-base-vendor.js',
},
'module-js': {
'source_filenames': (
rooted_glob(COMMON_ROOT / 'static/', 'xmodule/descriptors/js/*.js') +
......@@ -738,23 +769,9 @@ REQUIRE_BUILD_PROFILE = "cms/js/build.js"
# The name of the require.js script used by your project, relative to REQUIRE_BASE_URL.
REQUIRE_JS = "js/vendor/requiresjs/require.js"
# A dictionary of standalone modules to build with almond.js.
REQUIRE_STANDALONE_MODULES = {}
# Whether to run django-require in debug mode.
REQUIRE_DEBUG = False
# A tuple of files to exclude from the compilation result of r.js.
REQUIRE_EXCLUDE = ("build.txt",)
# The execution environment in which to run r.js: auto, node or rhino.
# auto will autodetect the environment and make use of node if available and
# rhino if not.
# It can also be a path to a custom class that subclasses
# require.environments.Environment and defines some "args" function that
# returns a list with the command arguments to execute.
REQUIRE_ENVIRONMENT = "node"
########################## DJANGO WEBPACK LOADER ##############################
WEBPACK_LOADER = {
......
cms/static/cms/js/build.js
(function() {
'use strict';
var commonLibrariesPath = 'common/js/common_libraries';
var getModule = function(moduleName, excludeCommonDeps) {
var module = {
name: moduleName
};
if (excludeCommonDeps) {
module.exclude = [commonLibrariesPath];
}
return module;
};
var getModulesList = function(modules) {
var result = [getModule(commonLibrariesPath)];
return result.concat(modules.map(function(moduleName) {
return getModule(moduleName, true);
}));
return modules.map(function(moduleName) {
return {name: moduleName};
});
};
var jsOptimize = process.env.REQUIRE_BUILD_PROFILE_OPTIMIZE !== undefined ?
process.env.REQUIRE_BUILD_PROFILE_OPTIMIZE : 'uglify2';
......@@ -77,10 +62,23 @@
* file should be skipped because it has no dependencies.
*/
paths: {
'gettext': 'empty:',
'xmodule': 'empty:',
'mathjax': 'empty:',
'youtube': 'empty:'
backbone: 'empty:',
gettext: 'empty:',
jquery: 'empty:',
'jquery.cookie': 'empty:',
'jquery-migrate': 'empty:',
logger: 'empty:',
mathjax: 'empty:',
underscore: 'empty:',
'underscore.string': 'empty:',
URI: 'empty:',
utility: 'empty:',
xmodule: 'empty:',
youtube: 'empty:',
// Don't bundle UI Toolkit helpers as they are loaded into the "edx" namespace
'edx-ui-toolkit/js/utils/html-utils': 'empty:',
'edx-ui-toolkit/js/utils/string-utils': 'empty:'
},
/**
......
cms/static/cms/js/require-config.js
/* globals _, requirejs */
/* eslint-disable quote-props */
/* eslint-disable quote-props, no-console, no-plusplus */
(function(require, define) {
'use strict';
var defineDependency, librarySetup;
// We do not wish to bundle common libraries (that may also be used by non-RequireJS code on the page
// into the optimized files. Therefore load these libraries through script tags and explicitly define them.
// Note that when the optimizer executes this code, window will not be defined.
if (window) {
// MathJax Fast Preview was introduced in 2.5. However, it
// causes undesirable flashing/font size changes when
// MathJax is used for interactive preview (equation editor).
// Setting processSectionDelay to 0 (see below) fully eliminates
// fast preview, but to reduce confusion, we are also setting
// the option as displayed in the context menu to false.
// When upgrading to 2.6, check if this variable name changed.
window.MathJax = {
menuSettings: {CHTMLpreview: false}
defineDependency = function(globalName, name, noShim) {
var getGlobalValue = function() {
var globalNamePath = globalName.split('.'),
result = window,
i;
for (i = 0; i < globalNamePath.length; i++) {
result = result[globalNamePath[i]];
}
return result;
},
globalValue = getGlobalValue();
if (globalValue) {
if (noShim) {
define(name, {});
} else {
define(name, [], function() { return globalValue; });
}
} else {
console.error('Expected library to be included on page, but not found on window object: ' + name);
}
};
librarySetup = function() {
// This is the function to setup all the vendor libraries
// Underscore.string no longer installs itself directly on '_'. For compatibility with existing
// code, add it to '_' with its previous name.
if (window._ && window.s) {
window._.str = window.s;
}
window.$.ajaxSetup({
contents: {
script: false
}
});
// MathJax Fast Preview was introduced in 2.5. However, it
// causes undesirable flashing/font size changes when
// MathJax is used for interactive preview (equation editor).
// Setting processSectionDelay to 0 (see below) fully eliminates
// fast preview, but to reduce confusion, we are also setting
// the option as displayed in the context menu to false.
// When upgrading to 2.6, check if this variable name changed.
window.MathJax = {
menuSettings: {CHTMLpreview: false}
};
};
// Since we are serving the gettext catalog as static files,
// the URL for the gettext file will vary depending on which locale
// needs to be served. To handle this, we load the correct file in the
// rendered template and then use this to ensure that RequireJS knows
// how to find it.
define('gettext', function() { return window.gettext; });
defineDependency('jQuery', 'jquery');
defineDependency('jQuery', 'jquery-migrate');
defineDependency('_', 'underscore');
defineDependency('s', 'underscore.string');
defineDependency('gettext', 'gettext');
defineDependency('Logger', 'logger');
defineDependency('URI', 'URI');
defineDependency('jQuery.url', 'jquery.url');
defineDependency('Backbone', 'backbone');
// Add the UI Toolkit helper classes that have been installed in the 'edx' namespace
defineDependency('edx.HtmlUtils', 'edx-ui-toolkit/js/utils/html-utils');
defineDependency('edx.StringUtils', 'edx-ui-toolkit/js/utils/string-utils');
// utility.js adds two functions to the window object, but does not return anything
defineDependency('isExternal', 'utility', true);
librarySetup();
}
require.config({
......
cms/templates/base.html
......@@ -56,11 +56,15 @@ from openedx.core.djangolib.js_utils import (
<a class="nav-skip" href="#main">${_("Skip to main content")}</a>
<%static:js group='base_vendor'/>
<script type="text/javascript">
window.baseUrl = "${settings.STATIC_URL | n, js_escaped_string}";
var require = {baseUrl: window.baseUrl};
require.config({
baseUrl: window.baseUrl
});
</script>
<script type="text/javascript" src="${static.url("common/js/vendor/require.js")}"></script>
<script type="text/javascript" src="${static.url("cms/js/require-config.js")}"></script>
<!-- view -->
......@@ -92,26 +96,24 @@ from openedx.core.djangolib.js_utils import (
<%block name="jsextra"></%block>
<script type="text/javascript">
require(['common/js/common_libraries'], function () {
require(['js/factories/base'], function () {
require(['js/models/course'], function(Course) {
% if context_course:
window.course = new Course({
id: "${context_course.id | n, js_escaped_string}",
name: "${context_course.display_name_with_default | n, js_escaped_string}",
url_name: "${context_course.location.name | n, js_escaped_string}",
org: "${context_course.location.org | n, js_escaped_string}",
num: "${context_course.location.course | n, js_escaped_string}",
display_course_number: "${context_course.display_coursenumber | n, js_escaped_string}",
revision: "${context_course.location.revision | n, js_escaped_string}",
self_paced: ${context_course.self_paced | n, dump_js_escaped_json}
});
% endif
% if user.is_authenticated():
require(['js/sock']);
% endif
<%block name='requirejs'></%block>
});
require(['js/factories/base'], function () {
require(['js/models/course'], function(Course) {
% if context_course:
window.course = new Course({
id: "${context_course.id | n, js_escaped_string}",
name: "${context_course.display_name_with_default | n, js_escaped_string}",
url_name: "${context_course.location.name | n, js_escaped_string}",
org: "${context_course.location.org | n, js_escaped_string}",
num: "${context_course.location.course | n, js_escaped_string}",
display_course_number: "${context_course.display_coursenumber | n, js_escaped_string}",
revision: "${context_course.location.revision | n, js_escaped_string}",
self_paced: ${context_course.self_paced | n, dump_js_escaped_json}
});
% endif
% if user.is_authenticated():
require(['js/sock']);
% endif
<%block name='requirejs'></%block>
});
});
</script>
......
common/static/common/js/common_libraries.js deleted 100644 → 0
define([
'edx-ui-toolkit/js/utils/string-utils',
'edx-ui-toolkit/js/utils/html-utils',
'domReady!',
'jquery',
'jquery-migrate',
'backbone',
'underscore',
'gettext'
],
function(StringUtils, HtmlUtils) {
'use strict';
// Install utility classes in the edX namespace to make them
// available to code that doesn't use RequireJS,
// e.g. XModules and XBlocks.
if (window) {
window.edx = window.edx || {};
window.edx.StringUtils = StringUtils;
window.edx.HtmlUtils = HtmlUtils;
}
});
lms/envs/common.py
......@@ -1248,9 +1248,6 @@ STATICFILES_FINDERS = [
PIPELINE_CSS_COMPRESSOR = None
PIPELINE_JS_COMPRESSOR = 'pipeline.compressors.uglifyjs.UglifyJSCompressor'
# Setting that will only affect the edX version of django-pipeline until our changes are merged upstream
PIPELINE_COMPILE_INPLACE = True
# Don't wrap JavaScript as there is code that depends upon updating the global namespace
PIPELINE_DISABLE_WRAPPER = True
......@@ -1732,21 +1729,9 @@ REQUIRE_BUILD_PROFILE = "lms/js/build.js"
# The name of the require.js script used by your project, relative to REQUIRE_BASE_URL.
REQUIRE_JS = "common/js/vendor/require.js"
# A dictionary of standalone modules to build with almond.js.
REQUIRE_STANDALONE_MODULES = {}
# Whether to run django-require in debug mode.
REQUIRE_DEBUG = False
# A tuple of files to exclude from the compilation result of r.js.
REQUIRE_EXCLUDE = ("build.txt",)
# The execution environment in which to run r.js: auto, node or rhino.
# auto will autodetect the environment and make use of node if available and rhino if not.
# It can also be a path to a custom class that subclasses require.environments.Environment
# and defines some "args" function that returns a list with the command arguments to execute.
REQUIRE_ENVIRONMENT = "node"
# In production, the Django pipeline appends a file hash to JavaScript file names.
# This makes it difficult for RequireJS to load its requirements, since module names
# specified in JavaScript code do not include the hash.
......
lms/static/lms/js/require-config.js
/* globals _, requirejs */
/* eslint-disable quote-props */
/* eslint-disable quote-props, no-console, no-plusplus */
(function(require, define) {
'use strict';
......
webpack.config.js
......@@ -127,7 +127,12 @@ var wpconfig = {
},
externals: {
gettext: 'gettext'
backbone: 'Backbone',
gettext: 'gettext',
jquery: 'jQuery',
logger: 'Logger',
underscore: '_',
URI: 'URI'
},
watchOptions: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment