Add linter option

Author: Ives van Hoorne

packages/app/src/app/components/CodeEditor/Monaco/index.js

@@ -331,6 +331,10 @@ class MonacoEditor extends React.Component<Props, State> implements Editor {
 
   changeSettings = (settings: $PropertyType<Props, 'settings'>) => {
     this.settings = settings;
+    if (settings.lintEnabled && !this.lintWorker) {
+      this.setupLintWorker();
+    }
+
     this.editor.updateOptions(this.getEditorOptions());
     this.forceUpdate();
   };
@@ -699,14 +703,16 @@ class MonacoEditor extends React.Component<Props, State> implements Editor {
 
   lint = async (code: string, title: string, version: number) => {
     const mode = await this.getMode(title);
-    if (mode === 'javascript' || mode === 'vue') {
-      if (this.lintWorker) {
-        this.lintWorker.postMessage({
-          code,
-          title,
-          version,
-          template: this.sandbox.template,
-        });
+    if (this.settings.lintEnabled) {
+      if (mode === 'javascript' || mode === 'vue') {
+        if (this.lintWorker) {
+          this.lintWorker.postMessage({
+            code,
+            title,
+            version,
+            template: this.sandbox.template,
+          });
+        }
       }
     }
   };

packages/app/src/app/pages/common/Modals/PreferencesModal/EditorPageSettings/EditorSettings/index.js

@@ -54,6 +54,16 @@ function EditorSettings({ store, signals }) {
             Automatically download type definitions for dependencies.
           </SubDescription>
           <Rule />
+          <PaddedPreference
+            title="ESLint"
+            type="boolean"
+            tooltip="Made possible by ESLint"
+            {...bindValue('lintEnabled')}
+          />
+          <SubDescription>
+            Whether linting as you type should be enabled.
+          </SubDescription>
+          <Rule />
           <PaddedPreference
             title="Prettify on save"
             type="boolean"