canvas-lms/frontend_build/clientAppPlugin.js

92 lines
4.0 KiB
JavaScript

// we have these mini apps in "client_apps" that used to be ember apps that
// got built on their own before the primary build ran. This Plugin
// takes care of taking their package-specific shims that require Core
// javascript from canvas, as well as dealing with a few other client-app-specific
// config issues.
var clientAppPlugin = function(){};
clientAppPlugin.prototype.apply = function(compiler){
compiler.plugin("normal-module-factory", function(nmf) {
nmf.plugin("before-resolve", function(result, callback) {
let request = result.request;
// the client apps use an old version of react and used requirejs aliases
// to keep it seperate from the react version the rest of canvas uses.
// This should shim that difference into the webpack build.
if(/client_apps\/canvas_quizzes/.test(result.context)){
if(request == "react"){
request = "old_unsupported_dont_use_react"
}
if(request == "react-router" || request == "canvas_packages/react-router"){
request = "old_unsupported_dont_use_react-router-webpack"
}
}
// client apps are using a jsx plugin for require js; we have a JSX
// loader for webpack so we can just ditch the loader prefix
if(/^jsx!/.test(request)){
request = request.replace("jsx!", "");
}
// client apps had to wrap this file with their own dependency mapping.
// Since webpack knows where to find all the dependencies, we can just load
// the core canvas jquery plugin directly.
if(/jquery\/instructure_date_and_time/.test(request)){
request = request.replace(/jquery\/instructure_date_and_time/, "jquery.instructure_date_and_time");
}
var newRequest = request;
if(/^canvas_quizzes\/apps\/[^/]+$/.test(request)){
// when a core app js file loads a client app (canvas_quizzes/app/statistics), rather than
// requiring the pre-built file (client_apps/dist/canvas_quizzes/apps/statistics.js)
// this reaches into it's respective
// "main" file for the app (client_apps/canvas_quizzes/apps/statistics/js/main)
// to compile from source (canvas).
newRequest = request + "/js/main";
} else if(/^canvas\/vendor\//.test(request)){
// client apps would prefix canvas vendor files with "canvas" and map them across.
// webpack knows where to look for vendor files, so we can ditch the prefix
// and let it resolve normally.
newRequest = request.replace(/^canvas\/vendor\//, '');
} else if(/^canvas_quizzes/.test(request)) {
// client apps have a set of common js files they share, prefixed by "canvas_quizzes".
// here we sniff those requires and rewrite them to the directory where the common
// javascript source files live.
newRequest = request.replace("canvas_quizzes", "canvas_quizzes/apps/common/js");
} else if(/^canvas_packages/.test(request)){
// client apps would prefix canvas core js files with "canvas_packages" and map them across.
// webpack knows where to look for canvas core files, so we can ditch the prefix
// and let it resolve normally.
newRequest = request.replace("canvas_packages/", "");
}
// each client app requests the common client app config, but it's
// not very webpack-friendly. This replaces those requests with webpack
// specific shims that do the same work without sharing a config file that
// has to know how to dynamically require similarly named files from different
// apps based on context.
if(/^canvas_quizzes\/config$/.test(result.request)){
if(/apps\/statistics\/js/.test(result.context)){
newRequest = "canvas_quizzes/apps/statistics/js/webpack_config";
}else if(/apps\/events\/js/.test(result.context)){
newRequest = "canvas_quizzes/apps/events/js/webpack_config";
}
}
result.request = newRequest;
return callback(null, result);
});
});
};
module.exports = clientAppPlugin;