vue.config.js

const GoogleFontsPlugin = require("@beyonk/google-fonts-webpack-plugin");

module.exports = {
  publicPath: ".",
  chainWebpack: config => {
    const fontRule = config.module.rule("font");
    fontRule.uses.clear();

    // updates for vue-svg-loader: https://www.npmjs.com/package/vue-svg-loader
    const svgRule = config.module.rule("svg");
    svgRule.uses.clear();
    svgRule
      .use("babel-loader")
      .loader("babel-loader")
      .end()
      .use("vue-svg-loader")
      .loader("vue-svg-loader");
  },
  configureWebpack: {
    devtool: "source-map",
    plugins: [
      new GoogleFontsPlugin({
        fonts: [
          {
            family: "Open Sans",
            variants: [
              "400",
              "600",
              "800",
            ],
          },
          {
            family: "Anton",
            variants: [
              "400",
            ],
          },
        ],
      }),
    ],

  },
  css: {
    loaderOptions: {
      sass: {
        prependData: [
          "@import 'bootstrap/scss/_functions.scss';",
          "@import 'bootstrap/scss/_variables.scss';",
          "@import 'bootstrap/scss/_mixins.scss';",
          "@import '@/scss/_variables.scss';"
        ].join("")
      }
    }
  }
};