refactor: Upgrade to Fusebox 2.0

client/js/components/copy-path.vue

@@ -0,0 +1,17 @@
+<template>
+    <div>
+        <p>{{ msg }}</p>
+        <input type="text" v-model="msg" />
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'app',
+        data () {
+            return {
+                msg: 'Welcome to Your Vue.js App'
+            }
+        }
+    }
+</script>

client/js/pages/view.js

@@ -1,12 +1,23 @@
 'use strict'
 
+/* eslint-disable no-new */
+
 import $ from 'jquery'
 import MathJax from 'mathjax'
+import * as CopyPath from '../components/copy-path.vue'
+import Vue from 'vue'
 
 module.exports = (alerts) => {
   if ($('#page-type-view').length) {
     let currentBasePath = ($('#page-type-view').data('entrypath') !== 'home') ? $('#page-type-view').data('entrypath') : ''
 
+    // Copy Path
+
+    new Vue({
+      el: '.modal-copypath',
+      render: h => h(CopyPath)
+    })
+
     // MathJax Render
 
     MathJax.Hub.Config({

fuse.js

@@ -188,11 +188,12 @@ globalTasks.then(() => {
 
       fuse = fsbx.FuseBox.init({
         homeDir: './client',
-        outFile: './assets/js/bundle.min.js',
+        output: './assets/js/$name.min.js',
         alias: ALIASES,
         shim: SHIMS,
         plugins: [
-          [ fsbx.SassPlugin({ includePaths: ['../core'] }), fsbx.CSSPlugin() ],
+          fsbx.VuePlugin(),
+          [ '.scss', fsbx.SassPlugin(), fsbx.CSSPlugin() ],
           fsbx.BabelPlugin({ comments: false, presets: ['es2015'] }),
           fsbx.JSONPlugin()
         ],
@@ -200,15 +201,16 @@ globalTasks.then(() => {
         log: true
       })
 
-      fuse.devServer('>index.js', {
+      fuse.dev({
         port: 4444,
-        httpServer: false,
-        hmr: false
+        httpServer: false
       })
 
-      // Server
+      fuse.bundle('bundle')
+        .instructions('> index.js')
+        .watch()
 
-      _.delay(() => {
+      fuse.run().then(() => {
         nodemon({
           exec: (args.i) ? 'node --inspect server' : 'node server',
           ignore: ['assets/', 'client/', 'data/', 'repo/', 'tests/'],
@@ -216,7 +218,8 @@ globalTasks.then(() => {
           watch: ['server'],
           env: { 'NODE_ENV': 'development' }
         })
-      }, 1000)
+      })
+
       break
     // =============================================
     // CONFIGURE - DEVELOPER MODE
@@ -226,11 +229,11 @@ globalTasks.then(() => {
 
       fuse = fsbx.FuseBox.init({
         homeDir: './client',
-        outFile: './assets/js/configure.min.js',
+        output: './assets/js/$name.min.js',
         alias: ALIASES,
         shim: SHIMS,
         plugins: [
-          [ fsbx.SassPlugin({ includePaths: ['../core'] }), fsbx.CSSPlugin() ],
+          [ '.scss', fsbx.SassPlugin(), fsbx.CSSPlugin() ],
           fsbx.BabelPlugin({ comments: false, presets: ['es2015'] }),
           fsbx.JSONPlugin()
         ],
@@ -238,14 +241,16 @@ globalTasks.then(() => {
         log: true
       })
 
-      fuse.devServer('>configure.js', {
+      fuse.dev({
         port: 4444,
         httpServer: false
       })
 
-      // Server
+      fuse.bundle('configure')
+        .instructions('> configure.js')
+        .watch()
 
-      _.delay(() => {
+      fuse.run().then(() => {
         nodemon({
           exec: 'node wiki configure',
           ignore: ['assets/', 'client/', 'data/', 'repo/', 'tests/'],
@@ -253,7 +258,8 @@ globalTasks.then(() => {
           watch: ['server/configure.js'],
           env: { 'NODE_ENV': 'development' }
         })
-      }, 1000)
+      })
+
       break
     // =============================================
     // BUILD ONLY MODE
@@ -261,11 +267,13 @@ globalTasks.then(() => {
     case 'build':
       fuse = fsbx.FuseBox.init({
         homeDir: './client',
+        output: './assets/js/$name.min.js',
         alias: ALIASES,
         shim: SHIMS,
         plugins: [
           fsbx.EnvPlugin({ NODE_ENV: 'production' }),
-          [ fsbx.SassPlugin({ outputStyle: 'compressed', includePaths: ['./node_modules/requarks-core'] }), fsbx.CSSPlugin() ],
+          fsbx.VuePlugin(),
+          [ '.scss', fsbx.SassPlugin({ outputStyle: 'compressed' }), fsbx.CSSPlugin() ],
           fsbx.BabelPlugin({
             config: {
               comments: false,
@@ -282,10 +290,10 @@ globalTasks.then(() => {
         log: true
       })
 
-      fuse.bundle({
-        './assets/js/bundle.min.js': '>index.js',
-        './assets/js/configure.min.js': '>configure.js'
-      }).then(() => {
+      fuse.bundle('bundle').instructions('> index.js')
+      fuse.bundle('configure').instructions('> configure.js')
+
+      fuse.run().then(() => {
         console.info(colors.green.bold('\nAssets compilation + bundling completed.'))
       }).catch(err => {
         console.error(colors.red(' X Bundle compilation failed! ' + err.message))

package.json

@@ -134,7 +134,7 @@
     "eslint-plugin-node": "latest",
     "eslint-plugin-promise": "latest",
     "eslint-plugin-standard": "latest",
-    "fuse-box": "^1.3.131",
+    "fuse-box": "^2.0.0-beta.13",
     "jest": "latest",
     "jquery": "^3.2.1",
     "jquery-contextmenu": "^2.4.4",
@@ -148,9 +148,11 @@
     "snyk": "latest",
     "standard": "latest",
     "twemoji-awesome": "^1.0.6",
+    "typescript": "^2.3.2",
     "uglify-js": "latest",
     "vee-validate": "^2.0.0-rc.2",
-    "vue": "^2.3.0"
+    "vue": "^2.3.2",
+    "vue-template-compiler": "^2.3.2"
   },
   "standard": {
     "globals": [

server/libs/markdown.js

@@ -112,10 +112,10 @@ const parseTree = (content) => {
       let content = ''
       let anchor = ''
       if (heading.children && heading.children.length > 0 && heading.children[0].type === 'link_open') {
-        content = removeMarkdown(heading.children[1].content)
+        content = mdRemove(heading.children[1].content)
         anchor = _.kebabCase(content)
       } else {
-        content = removeMarkdown(heading.content)
+        content = mdRemove(heading.content)
         anchor = _.kebabCase(heading.children.reduce((acc, t) => acc + t.content, ''))
       }
 

tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "allowJs": true,
+    "alwaysStrict": true,
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "noImplicitAny": true,
+    "preserveConstEnums": true,
+    "removeComments": true,
+    "sourceMap": false,
+    "strictNullChecks": true,
+    "suppressImplicitAnyIndexErrors": true,
+    "target": "es5"
+  }
+}