import { defineConfig, splitVendorChunkPlugin } from "vite";
import { resolve } from "path";
import path from "path";
// plg
import handlebars from "vite-plugin-handlebars";
import HandlebarUpdate from "./src/js/common/handlerUpdate";
// import imagemin from "imagemin";
// import imageminWebp from "imagemin-webp";
export default defineConfig({
root: path.resolve(__dirname, "src"),
base: "./",
plugins: [
HandlebarUpdate(),
handlebars({
partialDirectory: resolve(__dirname, "./src/partials/"),
reloadOnPartialChange: true,
}),
// await imagemin(["images/*.{jpg,png}"], {
// destination: "dist/images",
// plugins: [imageminWebp({ quality: 50 })],
// }),
// viteImagemin({
// gifsicle: {
// optimizationLevel: 3,
// interlaced: false,
// },
// optipng: {
// optimizationLevel: 3,
// },
// mozjpeg: {
// quality: 80,
// },
// pngquant: {
// quality: [0.8, 0.9],
// speed: 1,
// },
// svgo: {
// plugins: [
// {
// name: "removeViewBox",
// },
// {
// name: "removeEmptyAttrs",
// active: false,
// },
// ],
// },
// }),
splitVendorChunkPlugin(),
],
build: {
emptyOutDir: path.resolve(__dirname, "dist"),
outDir: path.resolve(__dirname, "dist"),
sourcemap: false,
minify: true,
rollupOptions: {
output: {
chunkFileNames: "js/[name].js",
entryFileNames: "js/[name].js",
assetFileNames: (assetInfo) => {
let info = assetInfo.name.split(".");
let extType = info[info.length - 1];
if (/png|jpe?g|svg|gif|tiff|bmp|ico/i.test(extType)) {
extType = "images";
} else if (/ttf|eot|svg|woff|woff2/.test(extType)) {
extType = "fonts";
}
return `${extType}/[name][extname]`;
},
},
input: {
index: path.resolve(__dirname, "src/index.html"),
},
},
},
server: {
port: 3000,
host: "0.0.0.0",
open: true,
hmr: true,
},
});function findVideos() {
let videos = document.querySelectorAll(".video");
for (let i = 0; i < videos.length; i++) {
setupVideo(videos[i]);
}
}
function setupVideo(video) {
let link = video.querySelector(".video__link");
let media = video.querySelector(".video__media");
let button = video.querySelector(".video__button");
let id = link.getAttribute("href");
video.addEventListener("click", () => {
let iframe = createIframe(id);
link.remove();
button.remove();
video.appendChild(iframe);
});
link.removeAttribute("href");
video.classList.add("video--enabled");
}
function createIframe(id) {
let iframe = document.createElement("iframe");
iframe.setAttribute("allowfullscreen", "");
iframe.setAttribute("allow", "autoplay");
iframe.setAttribute("src", generateURL(id));
iframe.classList.add("video__media");
return iframe;
}
function generateURL(id) {
return id;
}
findVideos();