diff --git a/app/components/monaco-editor.js b/app/components/monaco-editor.js index ae1f053..b6a39ee 100644 --- a/app/components/monaco-editor.js +++ b/app/components/monaco-editor.js @@ -1,20 +1,19 @@ import { action } from '@ember/object'; import Component from '@glimmer/component'; -// import 'monaco-editor/esm/vs/editor/browser/controller/coreCommands.js'; -// import 'monaco-editor/esm/vs/editor/contrib/find/findController.js'; -// import 'monaco-editor/esm/vs/language/json/monaco.contribution.js'; -// import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'; -import * as monaco from 'monaco-editor'; -// self.MonacoEnvironment = { -// getWorkerUrl(_, label) { -// if (label === 'json') { -// return '/json.worker.js'; -// } +import 'monaco-editor/esm/vs/editor/browser/coreCommands.js'; +import 'monaco-editor/esm/vs/editor/contrib/find/browser/findController.js'; +import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'; -// return '/editor.worker.js'; -// }, -// }; +// This is needed because the SimpleWorker.js in monaco-editor has the following code: +// loaderConfiguration = self.requirejs.s.contexts._.config; +window.requirejs.s = { + contexts: { + _: { + config: '', + }, + }, +}; export default class MonacoEditorComponent extends Component { constructor(owner, args) { @@ -25,7 +24,19 @@ export default class MonacoEditorComponent extends Component { @action initEditor(el) { + // let codeModel = monaco.editor.createModel(this.args.code, this.args.language) + // let height = codeModel.getLineCount() * 20; + // el.style.height = height.toString() + "px"; + this.editor = monaco.editor.create(el, { + // model: codeModel, + // theme: 'vs-dark', + // readOnly: this.readOnly, + // minimap: { enabled: false }, + // wordWrap: "on", + // scrollBeyondLastLine: false, + // wrappingIndent: 'same' + value: this.args.value, language: this.args.language, lineNumbers: 'off', diff --git a/ember-cli-build.js b/ember-cli-build.js index dd274ec..800a352 100644 --- a/ember-cli-build.js +++ b/ember-cli-build.js @@ -2,7 +2,7 @@ const EmberApp = require('ember-cli/lib/broccoli/ember-app'); const { Webpack } = require('@embroider/webpack'); -const path = require('path'); +const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin'); function isProduction() { return EmberApp.env() === 'production'; @@ -41,15 +41,6 @@ module.exports = function (defaults) { }, }, webpackConfig: { - entry: { - 'editor.worker': 'monaco-editor/esm/vs/editor/editor.worker.js', - 'json.worker': 'monaco-editor/esm/vs/language/json/json.worker.js', - }, - output: { - globalObject: 'self', - filename: '[name].js', - // path: path.resolve(__dirname, 'dist', 'assets'), - }, module: { rules: [ { test: /\.ttf$/, type: 'asset/resource' }, @@ -72,6 +63,11 @@ module.exports = function (defaults) { }, ], }, + plugins: [ + new MonacoWebpackPlugin({ + languages: ['json'], + }), + ], }, }, extraPublicTrees: [], diff --git a/package.json b/package.json index 700f861..8e1903f 100644 --- a/package.json +++ b/package.json @@ -94,6 +94,7 @@ "loader.js": "^4.7.0", "meilisearch": "^0.25.0", "monaco-editor": "^0.34.0", + "monaco-editor-webpack-plugin": "^7.0.1", "npm-run-all": "^4.1.5", "postcss": "^8.4.16", "postcss-loader": "^7.0.1", diff --git a/yarn.lock b/yarn.lock index 4f39898..2bf0eb2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9889,7 +9889,7 @@ loader-utils@^1.2.3: emojis-list "^3.0.0" json5 "^1.0.1" -loader-utils@^2.0.0: +loader-utils@^2.0.0, loader-utils@^2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-2.0.2.tgz#d6e3b4fb81870721ae4e0868ab11dd638368c129" integrity sha512-TM57VeHptv569d/GKh6TAYdzKblwDNiumOdkFnejjD0XwTH87K90w3O7AiJRqdQoXygvi1VQTJTLGhJl7WqA7A== @@ -10668,6 +10668,13 @@ mktemp@~0.4.0: resolved "https://registry.yarnpkg.com/mktemp/-/mktemp-0.4.0.tgz#6d0515611c8a8c84e484aa2000129b98e981ff0b" integrity sha512-IXnMcJ6ZyTuhRmJSjzvHSRhlVPiN9Jwc6e59V0bEJ0ba6OBeX2L0E+mRN1QseeOF4mM+F1Rit6Nh7o+rl2Yn/A== +monaco-editor-webpack-plugin@^7.0.1: + version "7.0.1" + resolved "https://registry.yarnpkg.com/monaco-editor-webpack-plugin/-/monaco-editor-webpack-plugin-7.0.1.tgz#ba19c60aba990184e36ad8722b1ed6a564527c7c" + integrity sha512-M8qIqizltrPlIbrb73cZdTWfU9sIsUVFvAZkL3KGjAHmVWEJ0hZKa/uad14JuOckc0GwnCaoGHvMoYtJjVyCzw== + dependencies: + loader-utils "^2.0.2" + monaco-editor@^0.34.0: version "0.34.0" resolved "https://registry.yarnpkg.com/monaco-editor/-/monaco-editor-0.34.0.tgz#b1749870a1f795dbfc4dc03d8e9b646ddcbeefa7"