const MonacoWebpackPlugin = require("monaco-editor-webpack-plugin");

module.exports = {
  //https://medium.com/@mrodal/how-to-make-lazy-loading-actually-work-in-vue-cli-3-7f3f88cfb102
  chainWebpack: config => {
    config.plugins.delete("prefetch");
  },

  configureWebpack: {
    devtool: "source-map", //THIS ENABLES DEBUGGING AT BROWSER!!
    plugins: [
      new MonacoWebpackPlugin({
        // available options are documented at https://github.com/Microsoft/monaco-editor-webpack-plugin#options
        //https://github.com/Microsoft/monaco-editor-webpack-plugin
        //  publicPath: "./js/",
        languages: [
          "javascript",
          "css",
          "html",
          "typescript",
          "json",
          "handlebars"
        ]
      })
    ]
  },

  transpileDependencies: ["vuetify"],

  pwa: {
    //https://cli.vuejs.org/core-plugins/pwa.html#configuration
    // manifestPath: "manifest.json",
    name: "AyaNova",
    themeColor: "#00205B",
    msTileColor: "#ffc40d",
    workboxPluginMode: "InjectManifest",
    workboxOptions: {
      swSrc: "./src/sw.js",
      swDest: "service-worker.js"
    },
    iconPaths: {
      //disable automatic icons, they have the wrong ones basically, use this guide https://developers.google.com/web/fundamentals/design-and-ux/browser-customization
      //and put them directly into the index.html in the public folder as it's the source one used
      //and https://realfavicongenerator.net/
      //favicon32: null,
      favicon16: null,
      appleTouchIcon: null,
      maskIcon: null,
      msTileImage: null
    }
  },
  productionSourceMap: false
};