Merge pull request #1268 from AaronGillBraun/parcel-docs

Added documentation for using parcel.

docs/integrate-esm.md

@@ -1,5 +1,10 @@
 ## Integrating the ESM version of the Monaco Editor
 
+- [Webpack](#using-webpack)
+  - [Option 1](#option-1-using-the-monaco-editor-loader-plugin)
+  - [Option 2](#option-2-using-plain-webpack)
+- [Parcel](#using-parcel)
+
 ### Using webpack
 
 Here is the most basic script that imports the editor using ESM with webpack.
@@ -115,3 +120,57 @@ module.exports = {
   }
 };
 ```
+
+---
+
+### Using parcel
+
+When using parcel, we need to use the `getWorkerUrl` function and build the workers seperately from our main source. To simplify things, we can write a tiny bash script to build the workers for us.
+
+* `index.js`
+```js
+import * as monaco from 'monaco-editor';
+
+self.MonacoEnvironment = {
+  getWorkerUrl: function(moduleId, label) {
+    if (label === 'json') {
+      return './json.worker.bundle.js';
+    }
+    if (label === 'css') {
+      return './css.worker.bundle.js';
+    }
+    if (label === 'html') {
+      return './html.worker.bundle.js';
+    }
+    if (label === 'typescript' || label === 'javascript') {
+      return './ts.worker.bundle.js';
+    }
+    return './editor.worker.bundle.js';
+  },
+};
+
+monaco.editor.create(document.getElementById('container'), {
+  value: [
+    'function x() {',
+    '\tconsole.log("Hello world!");',
+    '}'
+  ].join('\n'),
+  language: 'javascript'
+});
+```
+
+* `build_workers.sh`
+```sh
+ROOT=$PWD/node_modules/monaco-editor/esm/vs
+OPTS="--no-source-maps --log-level 1"        # Parcel options - See: https://parceljs.org/cli.html
+
+parcel build $ROOT/language/json/json.worker.js $OPTS
+parcel build $ROOT/language/css/css.worker.js $OPTS
+parcel build $ROOT/language/html/html.worker.js $OPTS
+parcel build $ROOT/language/typescript/ts.worker.js $OPTS
+parcel build $ROOT/editor/editor.worker.js $OPTS
+```
+
+Then, simply run `sh ./build_workers.sh && parcel index.html`. This builds the workers into the same directory as your main bundle (usually `./dist`). If you want to change the `--out-dir` of the workers, you must change the paths in `index.js` to reflect their new location.
+
+*note - the `getWorkerUrl` paths are relative to the build directory of your src bundle*