save WIP

not really getting the feel for this, will continue later, need to really learn how this works

vue/src/App.vue

@@ -1,5 +1,4 @@
 <template>
-  <img alt="Vue logo" src="./assets/logo.png">
   <HelloWorld msg="Welcome to Your Vue.js App"/>
 </template>
 

vue/src/components/HelloWorld.vue

@@ -1,32 +1,7 @@
 <template>
   <div class="hello">
     <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br>
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
-      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
-      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
-      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
-      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
-      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
-      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
-      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
-    </ul>
+
   </div>
 </template>
 
@@ -38,21 +13,3 @@ export default {
   }
 }
 </script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped>
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>

vue/vue.config.js

@@ -0,0 +1,56 @@
+const BundleTracker = require("webpack-bundle-tracker");
+
+const pages = {
+    'vue_app_01': {
+        entry: './src/main.js',
+        chunks: ['chunk-vendors']
+    },
+}
+
+module.exports = {
+    pages: pages,
+    filenameHashing: false,
+    productionSourceMap: false,
+    publicPath: process.env.NODE_ENV === 'production'
+        ? ''
+        : 'http://localhost:8080/',
+    outputDir: '../cookbook/static/vue/',
+
+    chainWebpack: config => {
+
+        config.optimization
+            .splitChunks({
+                cacheGroups: {
+                    vendor: {
+                        test: /[\\/]node_modules[\\/]/,
+                        name: "chunk-vendors",
+                        chunks: "all",
+                        priority: 1
+                    },
+                },
+            });
+
+        Object.keys(pages).forEach(page => {
+            config.plugins.delete(`html-${page}`);
+            config.plugins.delete(`preload-${page}`);
+            config.plugins.delete(`prefetch-${page}`);
+        })
+
+        config
+            .plugin('BundleTracker')
+            .use(BundleTracker, [{filename: '../vue/webpack-stats.json'}]);
+
+        config.resolve.alias
+            .set('__STATIC__', 'static')
+
+        config.devServer
+            .public('http://localhost:8080')
+            .host('localhost')
+            .port(8080)
+            .hotOnly(true)
+            .watchOptions({poll: 1000})
+            .https(false)
+            .headers({"Access-Control-Allow-Origin": ["*"]})
+
+    }
+};

vue/webpack-stats.json

@@ -0,0 +1 @@
+{"status":"done","chunks":{"chunk-vendors":[{"name":"js/chunk-vendors.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\chunk-vendors.js"}],"vue_app_01":[{"name":"css/vue_app_01.css","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\css\\vue_app_01.css"},{"name":"js/vue_app_01.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\vue_app_01.js"}]}}