From 240507dc912ce829098fd3c8b5b9fc4ac0a5d95f Mon Sep 17 00:00:00 2001 From: Marcus Mietz Date: Wed, 26 Aug 2020 19:17:13 +0200 Subject: [PATCH] feat: :sparkles: add vue.config.js with aliases, html head meta and image processing --- public/index.html | 20 +++-------- vue.config.js | 87 +++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 92 insertions(+), 15 deletions(-) create mode 100644 vue.config.js diff --git a/public/index.html b/public/index.html index 801bf8d..5d705d5 100644 --- a/public/index.html +++ b/public/index.html @@ -4,25 +4,15 @@ - Sebin Nyshkim - Reference Page - - - - - - - - - - - - - + + + <%= htmlWebpackPlugin.options.title %> +
diff --git a/vue.config.js b/vue.config.js new file mode 100644 index 0000000..3c42c24 --- /dev/null +++ b/vue.config.js @@ -0,0 +1,87 @@ +const path = require("path"); + +module.exports = { + publicPath: "", + css: { + sourceMap: process.env.NODE_ENV !== "production" + }, + configureWebpack: { + resolve: { + alias: { + "@fonts": path.resolve(__dirname, "src/assets/fonts/"), + "@img": path.resolve(__dirname, "src/assets/img/"), + "@scss": path.resolve(__dirname, "src/scss/"), + "@data": path.resolve(__dirname, "src/data/"), + "@mixins": path.resolve(__dirname, "src/mixins/"), + "@components": path.resolve(__dirname, "src/components/") + } + } + }, + chainWebpack: config => { + config.plugin("html").tap(args => { + const meta = { + title: "Sebin Nyshkim - Reference Page", + desc: "The official reference Page for Sebin Nyshkim", + type: "website", + url: "https://ref.sebin-nyshkim.net", + image: "favicon.png", + twitter: { + card: "summary", + creator: "@SebinNyshkim" + } + }; + + const links = { + icon: { + rel: "icon", + href: meta.image, + type: "image/png" + }, + favicon: { + rel: "favicon", + href: meta.image, + type: "image/png" + } + }; + + args[0].title = meta.title; + args[0].links = links; + args[0].meta = { + "twitter:card": meta.twitter.card, + "twitter:creator": meta.twitter.creator, + "twitter:description": meta.desc, + "twitter:text:title": meta.title, + "twitter:image": meta.image, + "og:title": meta.title, + "og:type": meta.type, + "og:url": meta.url, + "og:image": meta.image, + "og:description": meta.desc + }; + + return args; + }); + + config.module + .rule("images") + .test(/\.(png|jpe?g|gif|webp|svg)(\?.*)?$/i) + .use("image-webpack-loader") + .loader("image-webpack-loader") + .tap(options => { + const newOpts = { + mozjpeg: { + progressive: true, + quality: 75 + }, + pngquant: { + quality: [0.65, 0.9], + speed: 4 + }, + gifsicle: { + interlaced: false + } + }; + return { ...options, ...newOpts }; + }); + } +};