index.js 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219
  1. "use strict";
  2. const path = require("path");
  3. const loaderUtils = require("loader-utils");
  4. const fs = require("fs");
  5. const AddWorkerEntryPointPlugin_1 = require("./plugins/AddWorkerEntryPointPlugin");
  6. const languages_1 = require("./languages");
  7. const features_1 = require("./features");
  8. const INCLUDE_LOADER_PATH = require.resolve('./loaders/include');
  9. const EDITOR_MODULE = {
  10. label: 'editorWorkerService',
  11. entry: undefined,
  12. worker: {
  13. id: 'vs/editor/editor',
  14. entry: 'vs/editor/editor.worker'
  15. },
  16. };
  17. const languagesById = {};
  18. languages_1.languagesArr.forEach(language => languagesById[language.label] = language);
  19. const featuresById = {};
  20. features_1.featuresArr.forEach(feature => featuresById[feature.label] = feature);
  21. /**
  22. * Return a resolved path for a given Monaco file.
  23. */
  24. function resolveMonacoPath(filePath) {
  25. try {
  26. return require.resolve(path.join('monaco-editor/esm', filePath));
  27. }
  28. catch (err) {
  29. try {
  30. return require.resolve(path.join(process.cwd(), 'node_modules/monaco-editor/esm', filePath));
  31. }
  32. catch (err) {
  33. return require.resolve(filePath);
  34. }
  35. }
  36. }
  37. /**
  38. * Return the interpolated final filename for a worker, respecting the file name template.
  39. */
  40. function getWorkerFilename(filename, entry) {
  41. return loaderUtils.interpolateName({ resourcePath: entry }, filename, {
  42. content: fs.readFileSync(resolveMonacoPath(entry))
  43. });
  44. }
  45. function getFeaturesIds(userFeatures) {
  46. function notContainedIn(arr) {
  47. return (element) => arr.indexOf(element) === -1;
  48. }
  49. let featuresIds;
  50. if (userFeatures.length) {
  51. const excludedFeatures = userFeatures.filter(f => f[0] === '!').map(f => f.slice(1));
  52. if (excludedFeatures.length) {
  53. featuresIds = Object.keys(featuresById).filter(notContainedIn(excludedFeatures));
  54. }
  55. else {
  56. featuresIds = userFeatures;
  57. }
  58. }
  59. else {
  60. featuresIds = Object.keys(featuresById);
  61. }
  62. return featuresIds;
  63. }
  64. class MonacoEditorWebpackPlugin {
  65. constructor(options = {}) {
  66. const languages = options.languages || Object.keys(languagesById);
  67. const customLanguages = options.customLanguages || [];
  68. const features = getFeaturesIds(options.features || []);
  69. this.options = {
  70. languages: coalesce(languages.map(id => languagesById[id])).concat(customLanguages),
  71. features: coalesce(features.map(id => featuresById[id])),
  72. filename: options.filename || "[name].worker.js",
  73. publicPath: options.publicPath || '',
  74. globalAPI: options.globalAPI || false,
  75. };
  76. }
  77. apply(compiler) {
  78. const { languages, features, filename, publicPath, globalAPI } = this.options;
  79. const compilationPublicPath = getCompilationPublicPath(compiler);
  80. const modules = [EDITOR_MODULE].concat(languages).concat(features);
  81. const workers = [];
  82. modules.forEach((module) => {
  83. if (module.worker) {
  84. workers.push({
  85. label: module.label,
  86. id: module.worker.id,
  87. entry: module.worker.entry
  88. });
  89. }
  90. });
  91. const rules = createLoaderRules(languages, features, workers, filename, publicPath, compilationPublicPath, globalAPI);
  92. const plugins = createPlugins(compiler, workers, filename);
  93. addCompilerRules(compiler, rules);
  94. addCompilerPlugins(compiler, plugins);
  95. }
  96. }
  97. function addCompilerRules(compiler, rules) {
  98. const compilerOptions = compiler.options;
  99. if (!compilerOptions.module) {
  100. compilerOptions.module = { rules: rules };
  101. }
  102. else {
  103. const moduleOptions = compilerOptions.module;
  104. moduleOptions.rules = (moduleOptions.rules || []).concat(rules);
  105. }
  106. }
  107. function addCompilerPlugins(compiler, plugins) {
  108. plugins.forEach((plugin) => plugin.apply(compiler));
  109. }
  110. function getCompilationPublicPath(compiler) {
  111. if (compiler.options.output && compiler.options.output.publicPath) {
  112. if (typeof compiler.options.output.publicPath === 'string') {
  113. return compiler.options.output.publicPath;
  114. }
  115. else {
  116. console.warn(`Cannot handle options.publicPath (expected a string)`);
  117. }
  118. }
  119. return '';
  120. }
  121. function createLoaderRules(languages, features, workers, filename, pluginPublicPath, compilationPublicPath, globalAPI) {
  122. if (!languages.length && !features.length) {
  123. return [];
  124. }
  125. const languagePaths = flatArr(coalesce(languages.map(language => language.entry)));
  126. const featurePaths = flatArr(coalesce(features.map(feature => feature.entry)));
  127. const workerPaths = fromPairs(workers.map(({ label, entry }) => [label, getWorkerFilename(filename, entry)]));
  128. if (workerPaths['typescript']) {
  129. // javascript shares the same worker
  130. workerPaths['javascript'] = workerPaths['typescript'];
  131. }
  132. if (workerPaths['css']) {
  133. // scss and less share the same worker
  134. workerPaths['less'] = workerPaths['css'];
  135. workerPaths['scss'] = workerPaths['css'];
  136. }
  137. if (workerPaths['html']) {
  138. // handlebars, razor and html share the same worker
  139. workerPaths['handlebars'] = workerPaths['html'];
  140. workerPaths['razor'] = workerPaths['html'];
  141. }
  142. // Determine the public path from which to load worker JS files. In order of precedence:
  143. // 1. Plugin-specific public path.
  144. // 2. Dynamic runtime public path.
  145. // 3. Compilation public path.
  146. const pathPrefix = Boolean(pluginPublicPath)
  147. ? JSON.stringify(pluginPublicPath)
  148. : `typeof __webpack_public_path__ === 'string' ` +
  149. `? __webpack_public_path__ ` +
  150. `: ${JSON.stringify(compilationPublicPath)}`;
  151. const globals = {
  152. 'MonacoEnvironment': `(function (paths) {
  153. function stripTrailingSlash(str) {
  154. return str.replace(/\\/$/, '');
  155. }
  156. return {
  157. globalAPI: ${globalAPI},
  158. getWorkerUrl: function (moduleId, label) {
  159. var pathPrefix = ${pathPrefix};
  160. var result = (pathPrefix ? stripTrailingSlash(pathPrefix) + '/' : '') + paths[label];
  161. if (/^((http:)|(https:)|(file:)|(\\/\\/))/.test(result)) {
  162. var currentUrl = String(window.location);
  163. var currentOrigin = currentUrl.substr(0, currentUrl.length - window.location.hash.length - window.location.search.length - window.location.pathname.length);
  164. if (result.substring(0, currentOrigin.length) !== currentOrigin) {
  165. if(/^(\\/\\/)/.test(result)) {
  166. result = window.location.protocol + result
  167. }
  168. var js = '/*' + label + '*/importScripts("' + result + '");';
  169. var blob = new Blob([js], { type: 'application/javascript' });
  170. return URL.createObjectURL(blob);
  171. }
  172. }
  173. return result;
  174. }
  175. };
  176. })(${JSON.stringify(workerPaths, null, 2)})`,
  177. };
  178. return [
  179. {
  180. test: /monaco-editor[/\\]esm[/\\]vs[/\\]editor[/\\]editor.(api|main).js/,
  181. use: [{
  182. loader: INCLUDE_LOADER_PATH,
  183. options: {
  184. globals,
  185. pre: featurePaths.map((importPath) => resolveMonacoPath(importPath)),
  186. post: languagePaths.map((importPath) => resolveMonacoPath(importPath)),
  187. },
  188. }],
  189. },
  190. ];
  191. }
  192. function createPlugins(compiler, workers, filename) {
  193. var _a;
  194. const webpack = (_a = compiler.webpack) !== null && _a !== void 0 ? _a : require('webpack');
  195. return ([]
  196. .concat(workers.map(({ id, entry }) => new AddWorkerEntryPointPlugin_1.AddWorkerEntryPointPlugin({
  197. id,
  198. entry: resolveMonacoPath(entry),
  199. filename: getWorkerFilename(filename, entry),
  200. plugins: [
  201. new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 1 }),
  202. ],
  203. }))));
  204. }
  205. function flatArr(items) {
  206. return items.reduce((acc, item) => {
  207. if (Array.isArray(item)) {
  208. return [].concat(acc).concat(item);
  209. }
  210. return [].concat(acc).concat([item]);
  211. }, []);
  212. }
  213. function fromPairs(values) {
  214. return values.reduce((acc, [key, value]) => Object.assign(acc, { [key]: value }), {});
  215. }
  216. function coalesce(array) {
  217. return array.filter(Boolean);
  218. }
  219. module.exports = MonacoEditorWebpackPlugin;