import webpack from "webpack";
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

const PurgecssPlugin = require("purgecss-webpack-plugin");
const glob = require("glob-all");
const path = require("path");
require("dotenv").config();

module.exports = {
    dev: true,
    mode: "universal",
    server: {
        port: 8080, // default: 3000
        host: "0.0.0.0" // default: localhost
    },
    /*
        ** Headers of the page
        */
    head: {
        title: "HIDDEN",
        meta: [
        ],
        link: [
            {rel: "icon", type: "image/x-icon", href: "/favicon.ico"},
            {rel: "apple-touch-icon", sizes: "57x57", href: "/apple-icon-57x57.png"},
            {rel: "apple-touch-icon", sizes: "60x60", href: "/apple-icon-60x60.png"},
            {rel: "apple-touch-icon", sizes: "72x72", href: "/apple-icon-72x72.png"},
            {rel: "apple-touch-icon", sizes: "76x76", href: "/apple-icon-76x76.png"},
            {rel: "apple-touch-icon", sizes: "114x114", href: "/apple-icon-114x114.png"},
            {rel: "apple-touch-icon", sizes: "120x120", href: "/apple-icon-120x120.png"},
            {rel: "apple-touch-icon", sizes: "144x144", href: "/apple-icon-144x144.png"},
            {rel: "apple-touch-icon", sizes: "152x152", href: "/apple-icon-152x152.png"},
            {rel: "apple-touch-icon", sizes: "180x180", href: "/apple-icon-180x180.png"},
            {rel: "icon", type: "image/png", sizes: "192x192", href: "/android-icon-192x192.png"},
            {rel: "icon", type: "image/png", sizes: "32x32", href: "/favicon-32x32.png"},
            {rel: "icon", type: "image/png", sizes: "96x96", href: "/favicon-96x96.png"},
            {rel: "icon", type: "image/png", sizes: "16x16", href: "/favicon-16x16.png"},
            {
                rel: "stylesheet",
                href:
                    "https://fonts.googleapis.com/css?family=Roboto+Condensed:300i,400,400i,700%7cMarcellus+SC|Material+Icons"
            }
        ]
    },

    /*
        ** Customize the progress-bar color
        */
    loading: {
        color: "#e08821"
    },

    /*
        ** Global CSS
        */
    css: [
        "~/../node_modules/@fortawesome/fontawesome-free/css/fontawesome.css",
        "~/../node_modules/@fortawesome/fontawesome-free/css/solid.css",
        "~/../node_modules/@fortawesome/fontawesome-free/css/regular.css",
        "~/../node_modules/bootstrap/dist/css/bootstrap.min.css",
    ],

    /*
        ** Plugins to load before mounting the App
        */
    plugins: [
        "~/plugins/web3.js",
        "~/plugins/bootstrap.js",
        {src: "~/plugins/vue-slider-component.js", ssr: false},
        {src: "~/plugins/vue-3d-model.js", ssr: false},
        {src: "~/plugins/vue-videobg.js", ssr: false},
        {src: "~/plugins/chart", ssr: false},
    ],

    /*
        ** Nuxt.js modules
        */
    modules: [
        "@nuxtjs/dotenv",
        '@nuxtjs/style-resources',
        ['@nuxtjs/google-analytics', {
            id: 'HIDDEN'
        }]
    ],

    styleResources: {
        scss: ['./src/assets/scss/variables.scss', './node_modules/bootstrap/scss/_functions.scss', './node_modules/bootstrap/scss/_variables.scss', './node_modules/bootstrap/scss/_mixins.scss'],
    },

    /*
        ** Build configuration
        */
    build: {
        optimization: {
            minimize: false
        },
        // optimizeCSS: true,
        // parallel: true,
        plugins: [
            // set shortcuts as global for bootstrap
            new webpack.ProvidePlugin({
                $: "jquery",
                jQuery: "jquery",
                "window.jQuery": "jquery",
            }),
            // new BundleAnalyzerPlugin(),
        ],
        postcss: [
            require("autoprefixer")({
                browsers: ["last 2 versions"]
            }),
            require("postcss-pxtorem")({
                propList: ["*"]
            })
        ],
        /*
                ** Run ESLint on save
                */
        extend(config, {isDev, isClient}) {
            if (isDev && isClient) {
            }
            if (!isDev) {
                // Remove unused CSS using purgecss. See https://github.com/FullHuman/purgecss
                // for more information about purgecss.
                config.plugins.push(
                    new PurgecssPlugin({
                        paths: glob.sync([
                            path.join(__dirname, "./pages/**/*.vue"),
                            path.join(__dirname, "./layouts/**/*.vue"),
                            path.join(__dirname, "./components/**/*.vue")
                        ]),
                        whitelist: ["html", "body"]
                    })
                );
            }
        }
    },
    srcDir: "src/",
    rootDir: "./"
};