Vue: Automate Your Routing - webpack.config.js

webpack.config.js

const webpack = require("webpack");
const path = require("path");
const VueLoaderPlugin = require("vue-loader/lib/plugin");

module.exports = {
  entry: path.resolve(__dirname, "assets/bundle.js"),
  mode: "development",
  output: {
    path: path.resolve(__dirname, "assets/"),
    filename: "bundle.compiled.js"
  },
  module: {
    rules: [
      // this will apply to both plain `.js` files AND `<script>` blocks in `.vue` files
      {
        test: /\.js$/,
        loader: "babel-loader"
      },
      // this will apply to the `<template lang="pug">` blocks in `.vue` files
      {
        test: /\.pug$/,
        loader: "pug-plain-loader"
      },
      // this will apply to `.vue` files
      {
        test: /\.vue$/,
        loader: "vue-loader"
      },
    ],
  },
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js'
    },
  },
  plugins: [
    // make sure to include the plugin!
    new VueLoaderPlugin(),
  ]
};