From 253f997a4efe12e9b950892c507a3199681588c2 Mon Sep 17 00:00:00 2001 From: Dan Marshall Date: Wed, 14 Mar 2018 17:11:10 -0700 Subject: [PATCH] added Parcel bundler sample --- browser-esm-parcel/.gitignore | 3 + browser-esm-parcel/dist/index.html | 18 ++++ browser-esm-parcel/index.html | 28 +++++++ browser-esm-parcel/index.js | 127 +++++++++++++++++++++++++++++ browser-esm-parcel/package.json | 8 ++ 5 files changed, 184 insertions(+) create mode 100644 browser-esm-parcel/.gitignore create mode 100644 browser-esm-parcel/dist/index.html create mode 100644 browser-esm-parcel/index.html create mode 100644 browser-esm-parcel/index.js create mode 100644 browser-esm-parcel/package.json diff --git a/browser-esm-parcel/.gitignore b/browser-esm-parcel/.gitignore new file mode 100644 index 00000000..64b02284 --- /dev/null +++ b/browser-esm-parcel/.gitignore @@ -0,0 +1,3 @@ +dist/*.js +dist/*.css +.cache diff --git a/browser-esm-parcel/dist/index.html b/browser-esm-parcel/dist/index.html new file mode 100644 index 00000000..74e7f715 --- /dev/null +++ b/browser-esm-parcel/dist/index.html @@ -0,0 +1,18 @@ + + + + + + + + + + + + +
+ + + + + \ No newline at end of file diff --git a/browser-esm-parcel/index.html b/browser-esm-parcel/index.html new file mode 100644 index 00000000..72634798 --- /dev/null +++ b/browser-esm-parcel/index.html @@ -0,0 +1,28 @@ + + + + + + + + +

Monaco Editor Parcel Bundler Sample

+ +This sample shows how to load a small subset of the editor: + + +To run this sample, you need to: + +
+$/browser-esm-parcel> npm install .
+$/browser-esm-parcel> ./node_modules/.bin/parcel build node_modules/monaco-editor/esm/vs/editor/editor.worker.js
+$/browser-esm-parcel> ./node_modules/.bin/parcel build index.js
+
+ +Then, open the ./dist folder. + + + \ No newline at end of file diff --git a/browser-esm-parcel/index.js b/browser-esm-parcel/index.js new file mode 100644 index 00000000..1c67887d --- /dev/null +++ b/browser-esm-parcel/index.js @@ -0,0 +1,127 @@ + +// (1) Desired editor features: +import 'monaco-editor/esm/vs/editor/browser/controller/coreCommands.js'; +// import 'monaco-editor/esm/vs/editor/browser/widget/codeEditorWidget.js'; +// import 'monaco-editor/esm/vs/editor/browser/widget/diffEditorWidget.js'; +// import 'monaco-editor/esm/vs/editor/browser/widget/diffNavigator.js'; +// import 'monaco-editor/esm/vs/editor/contrib/bracketMatching/bracketMatching.js'; +// import 'monaco-editor/esm/vs/editor/contrib/caretOperations/caretOperations.js'; +// import 'monaco-editor/esm/vs/editor/contrib/caretOperations/transpose.js'; +// import 'monaco-editor/esm/vs/editor/contrib/clipboard/clipboard.js'; +// import 'monaco-editor/esm/vs/editor/contrib/codelens/codelensController.js'; +// import 'monaco-editor/esm/vs/editor/contrib/colorPicker/colorDetector.js'; +// import 'monaco-editor/esm/vs/editor/contrib/comment/comment.js'; +// import 'monaco-editor/esm/vs/editor/contrib/contextmenu/contextmenu.js'; +// import 'monaco-editor/esm/vs/editor/contrib/cursorUndo/cursorUndo.js'; +// import 'monaco-editor/esm/vs/editor/contrib/dnd/dnd.js'; +import 'monaco-editor/esm/vs/editor/contrib/find/findController.js'; +// import 'monaco-editor/esm/vs/editor/contrib/folding/folding.js'; +// import 'monaco-editor/esm/vs/editor/contrib/format/formatActions.js'; +// import 'monaco-editor/esm/vs/editor/contrib/goToDeclaration/goToDeclarationCommands.js'; +// import 'monaco-editor/esm/vs/editor/contrib/goToDeclaration/goToDeclarationMouse.js'; +// import 'monaco-editor/esm/vs/editor/contrib/gotoError/gotoError.js'; +// import 'monaco-editor/esm/vs/editor/contrib/hover/hover.js'; +// import 'monaco-editor/esm/vs/editor/contrib/inPlaceReplace/inPlaceReplace.js'; +// import 'monaco-editor/esm/vs/editor/contrib/linesOperations/linesOperations.js'; +// import 'monaco-editor/esm/vs/editor/contrib/links/links.js'; +// import 'monaco-editor/esm/vs/editor/contrib/multicursor/multicursor.js'; +// import 'monaco-editor/esm/vs/editor/contrib/parameterHints/parameterHints.js'; +// import 'monaco-editor/esm/vs/editor/contrib/quickFix/quickFixCommands.js'; +// import 'monaco-editor/esm/vs/editor/contrib/referenceSearch/referenceSearch.js'; +// import 'monaco-editor/esm/vs/editor/contrib/rename/rename.js'; +// import 'monaco-editor/esm/vs/editor/contrib/smartSelect/smartSelect.js'; +// import 'monaco-editor/esm/vs/editor/contrib/snippet/snippetController2.js'; +// import 'monaco-editor/esm/vs/editor/contrib/suggest/suggestController.js'; +// import 'monaco-editor/esm/vs/editor/contrib/toggleTabFocusMode/toggleTabFocusMode.js'; +// import 'monaco-editor/esm/vs/editor/contrib/wordHighlighter/wordHighlighter.js'; +// import 'monaco-editor/esm/vs/editor/contrib/wordOperations/wordOperations.js'; +// import 'monaco-editor/esm/vs/editor/standalone/browser/accessibilityHelp/accessibilityHelp.js'; +// import 'monaco-editor/esm/vs/editor/standalone/browser/inspectTokens/inspectTokens.js'; +// import 'monaco-editor/esm/vs/editor/standalone/browser/iPadShowKeyboard/iPadShowKeyboard.js'; +// import 'monaco-editor/esm/vs/editor/standalone/browser/quickOpen/quickOutline.js'; +// import 'monaco-editor/esm/vs/editor/standalone/browser/quickOpen/gotoLine.js'; +// import 'monaco-editor/esm/vs/editor/standalone/browser/quickOpen/quickCommand.js'; +// import 'monaco-editor/esm/vs/editor/standalone/browser/toggleHighContrast/toggleHighContrast.js'; +import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'; + +// (2) Desired languages: +// import 'monaco-editor/esm/vs/language/typescript/monaco.contribution'; +// import 'monaco-editor/esm/vs/language/css/monaco.contribution'; +// import 'monaco-editor/esm/vs/language/json/monaco.contribution'; +// import 'monaco-editor/esm/vs/language/html/monaco.contribution'; +// import 'monaco-editor/esm/vs/basic-languages/bat/bat.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/coffee/coffee.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/cpp/cpp.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/csharp/csharp.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/csp/csp.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/css/css.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/dockerfile/dockerfile.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/fsharp/fsharp.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/go/go.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/handlebars/handlebars.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/html/html.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/ini/ini.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/java/java.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/less/less.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/lua/lua.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/markdown/markdown.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/msdax/msdax.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/mysql/mysql.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/objective-c/objective-c.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/pgsql/pgsql.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/php/php.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/postiats/postiats.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/powershell/powershell.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/pug/pug.contribution.js'; +import 'monaco-editor/esm/vs/basic-languages/python/python.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/r/r.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/razor/razor.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/redis/redis.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/redshift/redshift.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/ruby/ruby.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/sb/sb.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/scss/scss.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/solidity/solidity.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/sql/sql.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/swift/swift.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/vb/vb.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/xml/xml.contribution.js'; +// import 'monaco-editor/esm/vs/basic-languages/yaml/yaml.contribution.js'; + + + +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.js'; + } +} + +monaco.editor.create(document.getElementById('container'), { + value: [ + 'from banana import *', + '', + 'class Monkey:', + ' # Bananas the monkey can eat.', + ' capacity = 10', + ' def eat(self, N):', + ' \'\'\'Make the monkey eat N bananas!\'\'\'', + ' capacity = capacity - N*banana.size', + '', + ' def feeding_frenzy(self):', + ' eat(9.25)', + ' return "Yum yum"', + ].join('\n'), + language: 'python' +}); diff --git a/browser-esm-parcel/package.json b/browser-esm-parcel/package.json new file mode 100644 index 00000000..1d1069e5 --- /dev/null +++ b/browser-esm-parcel/package.json @@ -0,0 +1,8 @@ +{ + "name": "helloworld", + "dependencies": {}, + "devDependencies": { + "monaco-editor": "^0.11.0", + "parcel-bundler": "^1.6.2" + } +}