Use ES6 export/import in docs components

docs/.vuepress/components/DemoBasicBlocks.vue

@@ -8,9 +8,10 @@
 </template>
 
 <script>
-module.exports = {
+import utils from './demos/utils.js';
+
+export default {
   mounted() {
-    const utils = require('./demos/utils.js');
     window.editor2 = grapesjs.init(utils.gjsConfigBlocks);
   }
 }

docs/.vuepress/components/DemoCanvasOnly.vue

@@ -2,9 +2,10 @@
 </template>
 
 <script>
-module.exports = {
+import utils from './demos/utils.js';
+
+export default {
   mounted() {
-    const utils = require('./demos/utils.js');
     const editor = grapesjs.init(utils.gjsConfigStart);
   }
 }

docs/.vuepress/components/DemoCustomPanels.vue

@@ -11,9 +11,10 @@
 </template>
 
 <script>
-module.exports = {
+import utils from './demos/utils.js';
+
+export default {
   mounted() {
-    const utils = require('./demos/utils.js');
     const editor3 = grapesjs.init(utils.gjsConfigPanels);
     editor3.Panels.addPanel(Object.assign({}, utils.panelTop, {
       el: '#panel__top3'

docs/.vuepress/components/DemoDevices.vue

@@ -24,9 +24,10 @@
 </template>
 
 <script>
-module.exports = {
+import utils from './demos/utils.js';
+
+export default {
   mounted() {
-    const utils = require('./demos/utils.js');
     const editor7 = grapesjs.init(utils.gjsConfigDevices);
     editor7.Panels.addPanel(Object.assign({}, utils.panelTop, {
       el: '#panel__top7'

docs/.vuepress/components/DemoLayers.vue

@@ -20,9 +20,10 @@
 </template>
 
 <script>
-module.exports = {
+import utils from './demos/utils.js';
+
+export default {
   mounted() {
-    const utils = require('./demos/utils.js');
     const editor4 = grapesjs.init(utils.gjsConfigLayers);
     editor4.Panels.addPanel(Object.assign({}, utils.panelTop, {
       el: '#panel__top4'

docs/.vuepress/components/DemoStyle.vue

@@ -22,9 +22,10 @@
 </template>
 
 <script>
-module.exports = {
+import utils from './demos/utils.js';
+
+export default {
   mounted() {
-    const utils = require('./demos/utils.js');
     const editor5 = grapesjs.init(utils.gjsConfigStyle);
     editor5.Panels.addPanel(Object.assign({}, utils.panelTop, {
       el: '#panel__top5'

docs/.vuepress/components/DemoTheme.vue

@@ -24,9 +24,10 @@
 </template>
 
 <script>
-module.exports = {
+import utils from './demos/utils.js';
+
+export default {
   mounted() {
-    const utils = require('./demos/utils.js');
     const editor8 = grapesjs.init(utils.gjsConfigTheme);
     editor8.Panels.addPanel(Object.assign({}, utils.panelTop, {
       el: '#panel__top8'

docs/.vuepress/components/DemoTraits.vue

@@ -23,9 +23,10 @@
 </template>
 
 <script>
-module.exports = {
+import utils from './demos/utils.js';
+
+export default {
   mounted() {
-    const utils = require('./demos/utils.js');
     const editor6 = grapesjs.init(utils.gjsConfigTraits);
     editor6.Panels.addPanel(Object.assign({}, utils.panelTop, {
       el: '#panel__top6'

docs/.vuepress/components/demos/utils.js

@@ -353,7 +353,7 @@ var gjsConfigTheme = Object.assign({}, gjsConfigBlocks, {
   deviceManager,
 });
 
-module.exports = {
+export default {
   gjsConfigStart,
   gjsConfigBlocks,
   gjsConfigPanels,

docs/.vuepress/config.js

@@ -1,6 +1,6 @@
 const version = require('./../../package.json').version;
 const isDev = process.argv[2] === 'dev';
-const devPath = 'https://localhost:8080/dist';
+const devPath = 'http://localhost:8080/dist';
 
 module.exports = {
   title: 'GrapesJS',

docs/.vuepress/theme/CarbonAds.vue

@@ -1,5 +1,5 @@
 <script>
-module.exports = {
+export default {
   render (h) {
     return h('div', { class: 'carbon-ads', attrs: { id: 'native-carbon' }})
   },

docs/.vuepress/theme/Layout.vue

@@ -8,7 +8,7 @@
 var Layout = require('@default-theme/Layout.vue').default;
 var CarbonAds = require('./CarbonAds.vue').default;
 
-module.exports = {
+export default {
   components: {
     Layout,
     CarbonAds,