Initial commit

7 years ago · 55ce460261
commit 55ce460261
5 changed files with 71 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1 @@
+node_modules
--- a/app.js
+++ b/app.js
@ -0,0 +1,11 @@
+// app.js
+// import Vue from './node_modules/vue/dist/vue.esm.browser.js'
+
+const app = new Vue({
+  el: '#app',
+  data() {
+    return {
+      message: 'Hello Webpack integration with vuejs'
+    }
+  }
+})
--- a/index.html
+++ b/index.html
@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Vuejs Webpack</title>
+    <style media="screen">
+      [v-cloak] {
+        display: none;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="app" v-cloak>
+      {{message}}
+    </div>
+    <script type="text/javascript" src="node_modules/vue/dist/vue.min.js"></script>
+    <script type="text/javascript" src="app.js"></script>
+  </body>
+</html>
--- a/package.json
+++ b/package.json
@ -0,0 +1,14 @@
+{
+  "name": "vuejs_webpack",
+  "version": "1.0.0",
+  "description": "Example project using webpack with vuejs",
+  "main": "app.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "drew@androiddrew.com",
+  "license": "MIT",
+  "dependencies": {
+    "vue": "^2.5.13"
+  }
+}
--- a/webpack.config.js
+++ b/webpack.config.js
@ -0,0 +1,26 @@
+module.exports = {
+  // Entry file
+  entry: './app.js',
+  output: {
+    //output bundle
+    filename: 'bundle.js'
+  },
+  modules: {
+    rules: [
+      {
+        // For .js files
+        test: /\.js$/,
+        use: {
+          // Use the babel loader
+          loader: 'bable-loader'
+        }
+      }
+    ]
+  },
+  resolve: {
+    alias: {
+      // Ensure the right Vue build is used
+      'vue$': 'vue/dist/vue.esm.js'
+    }
+  }
+}