feat: Initial Version (#1)

toolpath · Oct 8, 2018 · 5d8bb6f · 5d8bb6f
1 parent 4ca616c
commit 5d8bb6f
Show file tree

Hide file tree

Showing 7 changed files with 108 additions and 34 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,4 +1,4 @@
-module.exports = {
+/*module.exports = {
   root: true,
   parserOptions: {
     sourceType: 'module'
@@ -27,4 +27,37 @@ module.exports = {
     'jest/globals': true,
     jasmine: true
   }
+}*/
+
+module.exports = {
+    root: true,
+
+    env: {
+        browser: true,
+        node: true,
+        jest: true,
+    },
+
+    parserOptions: {
+        parser: 'babel-eslint'
+    },
+
+    extends: [
+        // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
+        // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
+        'plugin:vue/essential'
+    ],
+
+    // required to lint *.vue files
+    plugins: [
+        'vue'
+    ],
+
+    // add your custom rules here
+    rules: {},
+
+    globals: {
+        'jest/globals': true,
+        jasmine: true
+    }
 }
diff --git a/README.md b/README.md
@@ -4,7 +4,7 @@
 [![CircleCI](https://img.shields.io/circleci/project/github/NCViewer/ace-editor-module.svg?style=flat-square)](https://circleci.com/gh/NCViewer/ace-editor-module)
 [![Codecov](https://img.shields.io/codecov/c/github/NCViewer/ace-editor-module.svg?style=flat-square)](https://codecov.io/gh/NCViewer/ace-editor-module)
 [![Dependencies](https://david-dm.org/NCViewer/ace-editor-module/status.svg?style=flat-square)](https://david-dm.org/NCViewer/ace-editor-module)
-[![js-standard-style](https://img.shields.io/badge/code_style-standard-brightgreen.svg?style=flat-square)](http://standardjs.com)
+[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
 
 > Ace Editor module for Nuxt.js
 

diff --git a/lib/module.js b/lib/module.js
@@ -1,12 +1,16 @@
-// const { resolve } = require('path')
+const { resolve } = require('path')
 
 module.exports = async function module (moduleOptions) {
-  // const options = Object.assign({}, moduleOptions)
+    const options = Object.assign({}, moduleOptions)
 
-  // this.addPlugin({
-  //   src: resolve(__dirname, 'templates/plugin.js'),
-  //   fileName: 'ace-editor-module.js',
-  //   options
-  // })
+    // Options should allow specifying default theme/mode and a CDN
+
+    this.addPlugin({
+        src: resolve(__dirname, 'templates/plugin.js'),
+        fileName: 'ace-editor-module.js',
+        options,
+        ssr: false,
+    })
 }
+
 module.exports.meta = require('../package.json')
diff --git a/lib/templates/plugin.js b/lib/templates/plugin.js
@@ -1,4 +1,20 @@
-export default async function ({ router, store }) {
-
+// Automatically adds 'ace' to globals
+import ace from 'ace-builds/src-min-noconflict/ace'
+import 'ace-builds/src-min-noconflict/ext-searchbox'
+import 'ace-builds/src-min-noconflict/ext-settings_menu'
+// import 'ace-builds/src-min-noconflict/ext-language_tools'
+
+import 'ace-builds/src-min-noconflict/mode-javascript'    // Import GCode Syntax Highlighting mode
+import 'ace-builds/src-min-noconflict/theme-chrome'  // Import Ace Themes
 
+
+export default async function ({ router, store }) {
+    const useCDN = true;
+    const CDN = 'https://cdn.jsdelivr.net/npm/ace-builds@1.4.1/src-min-noconflict';
+    if (useCDN) {
+        ace.config.set('basePath', CDN);
+        ace.config.set('modePath', CDN);
+        ace.config.set('themePath', CDN);
+        ace.config.set('workerPath', CDN);
+    }
 }
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -29,20 +29,20 @@
     "testEnvironment": "node",
     "collectCoverage": true
   },
-  "dependencies": {},
+  "dependencies": {
+    "ace-builds": "^1.4.1"
+  },
   "devDependencies": {
-    "nuxt": "latest",
     "codecov": "latest",
     "eslint": "latest",
-    "eslint-config-standard": "latest",
     "eslint-plugin-import": "latest",
     "eslint-plugin-jest": "latest",
     "eslint-plugin-node": "latest",
     "eslint-plugin-promise": "latest",
-    "eslint-plugin-standard": "latest",
     "eslint-plugin-vue": "latest",
     "jest": "latest",
     "jsdom": "latest",
+    "nuxt": "latest",
     "standard-version": "latest"
   }
 }
diff --git a/test/fixture/pages/index.vue b/test/fixture/pages/index.vue
@@ -1,11 +1,39 @@
 <template>
-<div>
-    Works!
+<div style=" width: 80%; margin: auto;">
+    <div>Plugin Module Works!</div>
+    <div id="ace" style="height: 200px; width: 100%; border: solid 1px rgba(0,0,0,.3);"></div>
 </div>
 </template>
 
 <script>
-export default {
+    export default {
+        mounted() {
+            const editor = ace.edit('ace');
 
-}
-</script>
+            editor.setOptions({
+                theme: 'ace/theme/chrome',
+                mode: 'ace/mode/javascript',
+                printMargin: false,
+                vScrollBarAlwaysVisible: true,
+                scrollPastEnd: 1,
+                fontSize: 12,
+            });
+
+            editor.setValue(
+`    export default {
+        mounted() {
+            const editor = ace.edit('ace');
+            editor.setOptions({
+                theme: 'ace/theme/chrome',
+                mode: 'ace/mode/javascript',
+                printMargin: false,
+                vScrollBarAlwaysVisible: true,
+                scrollPastEnd: 1,
+                fontSize: 12,
+            });
+            editor.setValue(\`\`, -1);
+        }
+    }`, -1);
+        }
+    }
+</script>