minista 2.4.5 → 2.6.0

package/README.md

@@ -138,7 +138,25 @@ export default defineConfig({
       outDir: "assets/images", // string
     },
   },
-  vite: {}, // https://vitejs.dev/config/
+  vite: {}, // https://ja.vitejs.dev/config/
+  resolve: {
+    alias: [], // { [key: string]: string } | { find: string, replacement: string }[]
+  },
+  css: {
+    modules: {
+      cache: true,
+      scopeBehaviour: "local",
+      globalModulePaths: [],
+      generateScopedName: undefined,
+      hashPrefix: "",
+      localsConvention: "camelCaseOnly",
+    }, // https://ja.vitejs.dev/config/#css-modules
+    preprocessorOptions: {
+      scss: {},
+      less: {},
+      stylus: {},
+    }, // https://ja.vitejs.dev/config/#css-preprocessoroptions
+  },
   markdown: {
     syntaxHighlighter: "highlight", // "highlight" | "none"
     highlightOptions: {}, // https://github.com/rehypejs/rehype-highlight#options
@@ -155,7 +173,7 @@ export default defineConfig({
       max_preserve_newlines: 0,
       indent_inner_html: true,
       extra_liners: [],
-      inline: ["span", "b", "br", "code", "del", "s", "small", "strong", "wbr"],
+      inline: ["span", "strong", "b", "small", "del", "s", "code", "br", "wbr"],
     }, // https://github.com/beautify-web/js-beautify#css--html
     cssOptions: {}, // https://github.com/beautify-web/js-beautify#css--html
     jsOptions: {}, // https://github.com/beautify-web/js-beautify#options
@@ -170,6 +188,7 @@ export default defineConfig({
 
 ## Media
 
+- [SSG + Partial Hydration (部分的な React App) - minista v2.4](https://zenn.dev/qrac/articles/b9c65c1c0be901)
 - [Vite と esbuild を組み込み React 製 SSG を再構築 - minista v2](https://zenn.dev/qrac/articles/fbbbe7ccc3bdb1)
 - [React で書ける SSG 改善点と今後について - minista v1](https://zenn.dev/qrac/articles/a24de970148c7e)
 - [React(JSX)で書けるコーディング用 SSG - minista v0](https://zenn.dev/qrac/articles/7537521afcd1bf)

package/client.d.ts

@@ -1,3 +1,65 @@
+// CSS modules
+type CSSModuleClasses = { readonly [key: string]: string }
+
+declare module "*.module.css" {
+  const classes: CSSModuleClasses
+  export default classes
+}
+declare module "*.module.scss" {
+  const classes: CSSModuleClasses
+  export default classes
+}
+declare module "*.module.sass" {
+  const classes: CSSModuleClasses
+  export default classes
+}
+declare module "*.module.less" {
+  const classes: CSSModuleClasses
+  export default classes
+}
+declare module "*.module.styl" {
+  const classes: CSSModuleClasses
+  export default classes
+}
+declare module "*.module.stylus" {
+  const classes: CSSModuleClasses
+  export default classes
+}
+declare module "*.module.pcss" {
+  const classes: CSSModuleClasses
+  export default classes
+}
+
+// CSS
+declare module "*.css" {
+  const css: string
+  export default css
+}
+declare module "*.scss" {
+  const css: string
+  export default css
+}
+declare module "*.sass" {
+  const css: string
+  export default css
+}
+declare module "*.less" {
+  const css: string
+  export default css
+}
+declare module "*.styl" {
+  const css: string
+  export default css
+}
+declare module "*.stylus" {
+  const css: string
+  export default css
+}
+declare module "*.pcss" {
+  const css: string
+  export default css
+}
+
 declare module "*.mdx" {
   import { MDXProps } from "mdx/types"
   export default function MDXContent(props: MDXProps): JSX.Element

package/dist/build.d.ts

@@ -1,12 +1,14 @@
 import type { Options as MdxOptions } from "@mdx-js/esbuild";
 import type { Config as SvgrOptions } from "@svgr/core";
 import type { InlineConfig } from "vite";
-import type { MinistaResolveConfig, RootStaticContent, RootJsxContent, GlobalStaticData, GetGlobalStaticData, PageJsxContent, StaticData, StaticDataItem, GetStaticData, PartialModules } from "./types.js";
+import type { MinistaResolveConfig, MinistaResolveAlias, RootStaticContent, RootJsxContent, GlobalStaticData, GetGlobalStaticData, PageJsxContent, StaticData, StaticDataItem, GetStaticData, PartialModules, CssOptions } from "./types.js";
 export declare function buildTempPages(entryPoints: string[], buildOptions: {
     outBase: string;
     outDir: string;
+    alias: MinistaResolveAlias;
     mdxConfig: MdxOptions;
     svgrOptions: SvgrOptions;
+    cssOptions: CssOptions;
 }): Promise<void>;
 export declare function buildStaticPages(entryPoints: string[], tempRootFilePath: string, buildOptions: {
     outBase: string;
@@ -42,8 +44,10 @@ export declare function buildPartialStringIndex(partialModules: PartialModules,
 }): Promise<void>;
 export declare function buildPartialStringBundle(entryPoint: string, buildOptions: {
     outFile: string;
+    alias: MinistaResolveAlias;
     mdxConfig: MdxOptions;
     svgrOptions: SvgrOptions;
+    cssOptions: CssOptions;
 }): Promise<void>;
 export declare function buildPartialStringInitial(entryPoint: string, partialModules: PartialModules, buildOptions: {
     outFile: string;

package/dist/build.js

@@ -33,6 +33,7 @@ import {
 import { systemConfig } from "./system.js";
 import { getFilePath } from "./path.js";
 import {
+  getEsbuildAlias,
   resolvePlugin,
   svgrPlugin,
   rawPlugin,
@@ -40,6 +41,7 @@ import {
 } from "./esbuild.js";
 import { renderHtml } from "./render.js";
 import { slashEnd, reactStylesToString } from "./utils.js";
+import { CssModulePlugin } from "./css.js";
 const __filename = url.fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 const ministaPkgUrl = path.resolve(__dirname + "/../package.json");
@@ -70,11 +72,18 @@ const esbuildLoaders = {
   ".woff": "file",
   ".woff2": "file"
 };
+const esbuildAlias = [
+  {
+    find: "react/jsx-runtime",
+    replacement: "react/jsx-runtime.js"
+  }
+];
 const userPkgHasPreact = [
   ...Object.keys(userPkg.dependencies || {}),
   ...Object.keys(userPkg.devDependencies || {})
 ].includes("preact");
 async function buildTempPages(entryPoints, buildOptions) {
+  const alias = getEsbuildAlias([esbuildAlias, buildOptions.alias]);
   await esBuild({
     entryPoints,
     outbase: buildOptions.outBase,
@@ -90,10 +99,9 @@ async function buildTempPages(entryPoints, buildOptions) {
     external: esbuildExternals,
     loader: esbuildLoaders,
     plugins: [
+      resolvePlugin(alias),
+      CssModulePlugin(buildOptions.cssOptions),
       mdx(buildOptions.mdxConfig),
-      resolvePlugin({
-        "react/jsx-runtime": "react/jsx-runtime.js"
-      }),
       svgrPlugin(buildOptions.svgrOptions),
       rawPlugin(),
       partialHydrationPlugin()
@@ -181,7 +189,7 @@ async function buildHtmlPage(pageJsxContent, staticDataItem, routePath, rootStat
   const staticProps = staticDataItem.props;
   const reg1 = new RegExp(`^${outDir}|index.html`, "g");
   const reg2 = new RegExp(`.html`, "g");
-  const pathname = routePath.replace(reg1, "").replace(reg2, "");
+  const pathname = routePath.replace(reg1, "").replace(reg2, "").replaceAll("\\", "/");
   const location = { pathname };
   const RenderComponent = () => {
     if (RootComponent === Fragment) {
@@ -418,6 +426,7 @@ export { ${tmpExportsStr} }`;
   });
 }
 async function buildPartialStringBundle(entryPoint, buildOptions) {
+  const alias = getEsbuildAlias([esbuildAlias, buildOptions.alias]);
   await esBuild({
     entryPoints: [entryPoint],
     outfile: buildOptions.outFile,
@@ -430,10 +439,9 @@ async function buildPartialStringBundle(entryPoint, buildOptions) {
     external: esbuildExternals,
     loader: esbuildLoaders,
     plugins: [
+      resolvePlugin(alias),
+      CssModulePlugin(buildOptions.cssOptions),
       mdx(buildOptions.mdxConfig),
-      resolvePlugin({
-        "react/jsx-runtime": "react/jsx-runtime.js"
-      }),
       svgrPlugin(buildOptions.svgrOptions),
       rawPlugin()
     ]

package/dist/config.d.ts

@@ -1,5 +1,7 @@
-import type { MinistaConfig, MinistaUserConfig, MinistaResolveConfig } from "./types.js";
+import type { AliasOptions as ViteAliasOptions } from "vite";
+import type { MinistaConfig, MinistaUserConfig, MinistaResolveConfig, MinistaResolveAliasInput, MinistaResolveAlias } from "./types.js";
 export declare const defaultConfig: MinistaConfig;
 export declare function mergeConfig(userConfig: MinistaUserConfig): Promise<MinistaConfig>;
+export declare function mergeAlias(configAlias: MinistaResolveAliasInput, viteConfigAlias: ViteAliasOptions): Promise<MinistaResolveAlias>;
 export declare function resolveConfig(config: MinistaConfig): Promise<MinistaResolveConfig>;
 export declare function getConfig(userConfig: MinistaUserConfig): Promise<MinistaResolveConfig>;

package/dist/config.js

@@ -83,6 +83,24 @@ const defaultConfig = {
     }
   },
   vite: {},
+  resolve: {
+    alias: []
+  },
+  css: {
+    modules: {
+      cache: true,
+      scopeBehaviour: "local",
+      globalModulePaths: [],
+      generateScopedName: void 0,
+      hashPrefix: "",
+      localsConvention: "camelCaseOnly"
+    },
+    preprocessorOptions: {
+      scss: {},
+      less: {},
+      stylus: {}
+    }
+  },
   markdown: {
     syntaxHighlighter: "highlight",
     highlightOptions: {},
@@ -99,7 +117,7 @@ const defaultConfig = {
       max_preserve_newlines: 0,
       indent_inner_html: true,
       extra_liners: [],
-      inline: ["span", "b", "br", "code", "del", "s", "small", "strong", "wbr"]
+      inline: ["span", "strong", "b", "small", "del", "s", "code", "br", "wbr"]
     },
     cssOptions: {},
     jsOptions: {}
@@ -112,8 +130,40 @@ async function mergeConfig(userConfig) {
   const mergedConfig = customDeepmerge(defaultConfig, userConfig);
   return mergedConfig;
 }
+async function mergeAlias(configAlias, viteConfigAlias) {
+  const alias = [];
+  async function getAlias(input) {
+    if (!input) {
+      return;
+    } else if (Array.isArray(input) && input.length > 0) {
+      await Promise.all(input.map(async (item) => {
+        const pattern = {
+          find: item.find,
+          replacement: item.replacement
+        };
+        return alias.push(pattern);
+      }));
+    } else if (typeof input === "object") {
+      await Promise.all(Object.entries(input).map((item) => {
+        const pattern = {
+          find: item[0],
+          replacement: item[1]
+        };
+        return alias.push(pattern);
+      }));
+    }
+  }
+  await getAlias(configAlias);
+  await getAlias(viteConfigAlias);
+  return alias;
+}
 async function resolveConfig(config) {
+  var _a;
+  const configAlias = config.resolve.alias;
+  const viteConfigAlias = ((_a = config.vite.resolve) == null ? void 0 : _a.alias) || {};
+  const alias = await mergeAlias(configAlias, viteConfigAlias);
   const resolvedConfig = __spreadProps(__spreadValues({}, config), {
+    alias,
     rootSrcDir: noSlashEnd(config.root.srcDir),
     pagesSrcDir: noSlashEnd(config.pages.srcDir),
     publicOutDir: noSlashEnd(config.out),
@@ -138,6 +188,7 @@ async function getConfig(userConfig) {
 export {
   defaultConfig,
   getConfig,
+  mergeAlias,
   mergeConfig,
   resolveConfig
 };

package/dist/css.d.ts

@@ -0,0 +1,3 @@
+import type { Plugin } from "esbuild";
+import type { CssOptions } from "./types.js";
+export declare function CssModulePlugin(options: CssOptions): Plugin;

package/dist/css.js

@@ -0,0 +1,150 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import React from "react";
+import fs from "fs-extra";
+import path from "path";
+import postcss from "postcss";
+import postcssModules from "postcss-modules";
+var PreprocessLang = /* @__PURE__ */ ((PreprocessLang2) => {
+  PreprocessLang2["less"] = "less";
+  PreprocessLang2["sass"] = "sass";
+  PreprocessLang2["scss"] = "scss";
+  PreprocessLang2["styl"] = "styl";
+  PreprocessLang2["stylus"] = "stylus";
+  return PreprocessLang2;
+})(PreprocessLang || {});
+const PLUGIN = "esbuild-cssmodule-plugin";
+const cssLangs = `\\.(css|less|sass|scss|styl|stylus)($|\\?)`;
+const cssLangRE = new RegExp(cssLangs);
+async function loadPreprocessor(lang) {
+  try {
+    const preprocessor = await import(lang);
+    return preprocessor.default;
+  } catch (e) {
+    if (e.code === "ERR_MODULE_NOT_FOUND") {
+      throw new Error(`Preprocessor dependency "${lang}" not found. Did you install it?`);
+    } else {
+      const error = new Error(`Preprocessor dependency "${lang}" failed to load:
+${e.message}`);
+      error.stack = `${e.stack}
+${error.stack}`;
+      throw error;
+    }
+  }
+}
+const less = async (filepath, options) => {
+  const less2 = await loadPreprocessor("less" /* less */);
+  const content = await fs.readFile(filepath, "utf8");
+  less2.render("", {});
+  const result = await less2.render(content, __spreadValues({}, options.preprocessorOptions.less));
+  return result.css;
+};
+const scss = async (scssFullPath, options) => {
+  const sass = await loadPreprocessor("sass" /* sass */);
+  const result = await sass.compileAsync(scssFullPath, __spreadValues({}, options.preprocessorOptions.scss));
+  return result.css;
+};
+const stylus = async (filepath, options) => {
+  const stylus2 = await loadPreprocessor("stylus" /* stylus */);
+  const content = await fs.readFile(filepath, "utf8");
+  const result = stylus2(content, __spreadValues({}, options.preprocessorOptions.stylus)).set("filename", filepath).render();
+  return result;
+};
+const preProcessors = {
+  ["less" /* less */]: less,
+  ["sass" /* sass */]: scss,
+  ["scss" /* scss */]: scss,
+  ["styl" /* styl */]: stylus,
+  ["stylus" /* stylus */]: stylus
+};
+async function buildCss(filepath, options) {
+  var _a;
+  const lang = (_a = filepath.match(cssLangRE)) == null ? void 0 : _a[1];
+  let css = void 0;
+  if (lang !== "css") {
+    const preProcessor = preProcessors[lang];
+    if (preProcessor) {
+      css = await preProcessor(filepath, options);
+    } else {
+      console.warn(`${PLUGIN}: Unsupported CSS language: ${lang}`);
+      return;
+    }
+  } else {
+    css = await fs.readFile(filepath, "utf8");
+  }
+  return css;
+}
+async function buildJs(filepath, options) {
+  const css = await buildCss(filepath, options);
+  if (!css)
+    return;
+  let cssModulesJSON = {};
+  await postcss([
+    postcssModules(__spreadProps(__spreadValues({}, options.modules), {
+      getJSON(_, json) {
+        cssModulesJSON = json;
+        return cssModulesJSON;
+      }
+    }))
+  ]).process(css, {
+    from: filepath,
+    map: false
+  });
+  const classNames = JSON.stringify(cssModulesJSON);
+  return `export default ${classNames};`;
+}
+function CssModulePlugin(options) {
+  const filter = new RegExp(`\\.module${cssLangs}`);
+  return {
+    name: PLUGIN,
+    setup(build) {
+      const results = /* @__PURE__ */ new Map();
+      build.onResolve({ filter, namespace: "file" }, async (args) => {
+        if (!options.modules)
+          return args;
+        const sourceFullPath = path.resolve(args.resolveDir, args.path);
+        if (results.has(sourceFullPath))
+          return results.get(sourceFullPath);
+        const content = await buildJs(sourceFullPath, options);
+        const result = {
+          path: args.path,
+          namespace: PLUGIN,
+          pluginData: {
+            content
+          }
+        };
+        if (options.modules.cache)
+          results.set(sourceFullPath, result);
+        return result;
+      });
+      build.onLoad({ filter, namespace: PLUGIN }, (args) => {
+        if (!args.pluginData.content)
+          return args;
+        return {
+          contents: args.pluginData.content,
+          loader: "js"
+        };
+      });
+    }
+  };
+}
+export {
+  CssModulePlugin
+};

package/dist/esbuild.d.ts

@@ -1,5 +1,9 @@
 import type { Plugin } from "esbuild";
 import type { Config as SvgrOptions } from "@svgr/core";
+import type { MinistaResolveAlias } from "./types.js";
+export declare function getEsbuildAlias(aliasArray: MinistaResolveAlias[]): {
+    [key: string]: string;
+};
 /*! Fork: esbuild-plugin-resolve | https://github.com/markwylde/esbuild-plugin-resolve */
 export declare function resolvePlugin(options: {
     [key: string]: string;

package/dist/esbuild.js

@@ -19,6 +19,13 @@ import fs from "fs-extra";
 import path from "path";
 import { v4 as uuidv4 } from "uuid";
 import { systemConfig } from "./system.js";
+function getEsbuildAlias(aliasArray) {
+  const alias = [...aliasArray].flat();
+  const result = Object.assign({}, ...alias.map((item) => ({
+    [item.find]: item.replacement
+  })));
+  return result;
+}
 /*! Fork: esbuild-plugin-resolve | https://github.com/markwylde/esbuild-plugin-resolve */
 function resolvePlugin(options) {
   function resolvePluginIntercept(build, moduleName, moduleTarget) {
@@ -120,6 +127,7 @@ function partialHydrationPlugin() {
   };
 }
 export {
+  getEsbuildAlias,
   partialHydrationPlugin,
   rawPlugin,
   resolvePlugin,

package/dist/generate.js

@@ -46,8 +46,10 @@ async function generateTempRoot(config, mdxConfig) {
     await buildTempPages([srcRootFilePaths[0]], {
       outBase: config.rootSrcDir,
       outDir: systemConfig.temp.root.outDir,
+      alias: config.alias,
       mdxConfig,
-      svgrOptions: config.assets.svgr.svgrOptions
+      svgrOptions: config.assets.svgr.svgrOptions,
+      cssOptions: config.css
     });
   }
 }
@@ -56,8 +58,10 @@ async function generateTempPages(config, mdxConfig) {
   await buildTempPages(srcPageFilePaths, {
     outBase: config.pagesSrcDir,
     outDir: systemConfig.temp.pages.outDir,
+    alias: config.alias,
     mdxConfig,
-    svgrOptions: config.assets.svgr.svgrOptions
+    svgrOptions: config.assets.svgr.svgrOptions,
+    cssOptions: config.css
   });
 }
 async function generateTempAssets(config, viteConfig) {
@@ -90,7 +94,9 @@ async function generatePartialHydration(config, mdxConfig, viteConfig) {
   await buildPartialStringBundle(stringIndex, {
     outFile: stringBundle,
     mdxConfig,
-    svgrOptions: config.assets.svgr.svgrOptions
+    alias: config.alias,
+    svgrOptions: config.assets.svgr.svgrOptions,
+    cssOptions: config.css
   });
   await optimizeCommentOutStyleImport([stringBundle]);
   await buildPartialStringInitial(stringBundle, partialModules, {

package/dist/path.js

@@ -1,22 +1,22 @@
 import React from "react";
 import fs from "fs-extra";
+import fg from "fast-glob";
 import path from "path";
-import glob from "tiny-glob";
 function getFilePath(targetDir, fileName, extension) {
   const filePath = `${targetDir}/${fileName}.${extension}`;
   const file = fs.existsSync(path.resolve(filePath)) ? path.resolve(filePath) : "";
   return file;
 }
 async function getFilePaths(targetDir, extensions) {
-  const strExtension = typeof extensions === "string" ? extensions : extensions.join();
-  const globPattern = `${targetDir}/**/*.{${strExtension}}`;
-  const files = await glob(globPattern);
+  const strExtension = typeof extensions === "string" ? extensions : extensions.join("|");
+  const globPattern = `${targetDir}/**/*.+(${strExtension})`;
+  const files = await fg(globPattern, { extglob: true });
   return files;
 }
 async function getSameFilePaths(targetDir, fileName, extensions) {
-  const strExtension = typeof extensions === "string" ? extensions : extensions.join();
-  const globPattern = `${targetDir}/${fileName}.{${strExtension}}`;
-  const files = await glob(globPattern);
+  const strExtension = typeof extensions === "string" ? extensions : extensions.join("|");
+  const globPattern = `${targetDir}/${fileName}.+(${strExtension})`;
+  const files = await fg(globPattern, { extglob: true });
   return files;
 }
 export {

package/dist/types.d.ts

@@ -1,9 +1,12 @@
 import type { ExoticComponent } from "react";
 import type { UserConfig as ViteUserConfig, CorsOptions as ViteCorsOptions } from "vite";
 import type { Config as SvgrOptions } from "@svgr/core";
+import type { SvgstoreAddOptions } from "@qrac/svgstore";
 import type { Options as HighlightOptions } from "rehype-highlight";
 import type { Options as MdxOptions } from "@mdx-js/esbuild";
 import type { HTMLBeautifyOptions, CSSBeautifyOptions, JSBeautifyOptions } from "js-beautify";
+import type Sass from "sass";
+import type Stylus from "stylus";
 export declare type MinistaConfig = {
     base: string;
     public: string;
@@ -56,7 +59,7 @@ export declare type MinistaConfig = {
             srcDir: string;
             outDir: string;
             outName: string;
-            svgstoreOptions: MinistaSvgstoreOptions;
+            svgstoreOptions: SvgstoreAddOptions;
         };
         download: {
             useRemote: boolean;
@@ -66,6 +69,10 @@ export declare type MinistaConfig = {
         };
     };
     vite: ViteUserConfig;
+    resolve: {
+        alias: MinistaResolveAliasInput;
+    };
+    css: CssOptions;
     markdown: {
         syntaxHighlighter: "highlight" | "none";
         highlightOptions: HighlightOptions;
@@ -131,7 +138,7 @@ export declare type MinistaUserConfig = {
             srcDir?: string;
             outDir?: string;
             outName?: string;
-            svgstoreOptions?: MinistaSvgstoreOptions;
+            svgstoreOptions?: SvgstoreAddOptions;
         };
         download?: {
             useRemote?: boolean;
@@ -141,6 +148,10 @@ export declare type MinistaUserConfig = {
         };
     };
     vite?: ViteUserConfig;
+    resolve?: {
+        alias?: MinistaResolveAliasInput;
+    };
+    css?: CssUserOptions;
     markdown?: {
         syntaxHighlighter?: "highlight" | "none";
         highlightOptions?: HighlightOptions;
@@ -154,19 +165,20 @@ export declare type MinistaUserConfig = {
         jsOptions?: JSBeautifyOptions;
     };
 };
-export declare type MinistaSvgstoreOptions = {
-    cleanDefs?: Boolean | string[];
-    cleanSymbols?: Boolean | string[];
-    svgAttrs?: Boolean | {
-        [key: string]: string;
-    };
-    symbolAttrs?: Boolean | {
-        [key: string]: string;
-    };
-    copyAttrs?: Boolean | string[];
-    renameDefs?: Boolean;
+export declare type MinistaResolveConfig = MinistaConfig & MinistaResolveAliasConfig & MinistaResolvePathConfig;
+export declare type MinistaResolveAliasInput = {
+    [key: string]: string;
+} | {
+    find: string;
+    replacement: string;
+}[];
+export declare type MinistaResolveAlias = {
+    find: string;
+    replacement: string;
+}[];
+export declare type MinistaResolveAliasConfig = {
+    alias: MinistaResolveAlias;
 };
-export declare type MinistaResolveConfig = MinistaConfig & MinistaResolvePathConfig;
 export declare type MinistaResolvePathConfig = {
     rootSrcDir: string;
     pagesSrcDir: string;
@@ -271,3 +283,27 @@ export declare type PartialModules = {
 export declare type PartialString = {
     [key: string]: string;
 };
+export declare type CssOptions = {
+    modules: CSSModulesOptions | false;
+    preprocessorOptions: {
+        scss: Sass.Options<"async">;
+        less: Less.Options;
+        stylus: Stylus.RenderOptions;
+    };
+};
+export declare type CssUserOptions = {
+    modules?: Partial<CSSModulesOptions> | false;
+    preprocessorOptions?: {
+        scss?: Sass.Options<"async">;
+        less?: Less.Options;
+        stylus?: Stylus.RenderOptions;
+    };
+};
+export declare type CSSModulesOptions = {
+    cache: boolean;
+    scopeBehaviour: "global" | "local";
+    globalModulePaths: RegExp[];
+    generateScopedName: undefined | string | ((name: string, filename: string, css: string) => string);
+    hashPrefix: string;
+    localsConvention: "camelCase" | "camelCaseOnly" | "dashes" | "dashesOnly";
+};

package/dist/vite.d.ts

@@ -1,10 +1,11 @@
 import type { UserConfig as ViteConfig, Plugin } from "vite";
 import type { Config as SvgrOptions } from "@svgr/core";
 import type { Options as MdxOptions } from "@mdx-js/esbuild";
-import type { MinistaResolveConfig, MinistaSvgstoreOptions, MinistaCliDevOptions, MinistaCliPreviewOptions } from "./types.js";
+import type { SvgstoreAddOptions } from "@qrac/svgstore";
+import type { MinistaResolveConfig, MinistaCliDevOptions, MinistaCliPreviewOptions } from "./types.js";
 export declare function getViteConfig(config: MinistaResolveConfig, mdxConfig: MdxOptions, cliOptions?: MinistaCliDevOptions | MinistaCliPreviewOptions): Promise<ViteConfig>;
 export declare function resolveEntry(entry: string | string[] | {}): {};
 export declare function vitePluginMinistaVirtualHtml(): Plugin;
 /*! Fork: vite-plugin-svgr | https://github.com/pd4d10/vite-plugin-svgr */
 export declare function vitePluginMinistaSvgr(svgrOptions: SvgrOptions): Plugin;
-export declare function vitePluginMinistaSvgSpriteIcons(srcDir: string, options: MinistaSvgstoreOptions | undefined, output: string, tempOutput: string): Plugin;
+export declare function vitePluginMinistaSvgSpriteIcons(srcDir: string, options: SvgstoreAddOptions | undefined, output: string, tempOutput: string): Plugin;

package/dist/vite.js

@@ -12,7 +12,7 @@ import {
 } from "vite";
 import react from "@vitejs/plugin-react";
 import mdx from "@mdx-js/rollup";
-import svgstore from "svgstore";
+import svgstore from "@qrac/svgstore";
 import { systemConfig } from "./system.js";
 import { getFilePaths } from "./path.js";
 import { getFilename, getFilenameObject } from "./utils.js";
@@ -88,9 +88,15 @@ async function getViteConfig(config, mdxConfig, cliOptions) {
         "react-helmet"
       ]
     },
-    customLogger: createLogger("info", { prefix: "[minista]" })
+    customLogger: createLogger("info", { prefix: "[minista]" }),
+    css: config.css
   });
   const mergedViteConfig = mergeViteConfig(defaultViteConfig, config.vite);
+  if (config.alias.length > 0) {
+    await Promise.all(config.alias.map(async (item) => {
+      return mergedViteConfig.resolve.alias.push(item);
+    }));
+  }
   const svgrPlugin = vitePluginMinistaSvgr(config.assets.svgr.svgrOptions);
   mergedViteConfig.plugins.push(svgrPlugin);
   if (config.assets.icons.useSprite) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "minista",
   "description": "Next.js Like Development with 100% Static Generate",
-  "version": "2.4.5",
+  "version": "2.6.0",
   "bin": {
     "minista": "./bin/minista.js"
   },
@@ -67,23 +67,41 @@
     "semi": false
   },
   "peerDependencies": {
+    "less": "*",
     "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "react-dom": "^17.0.2",
+    "sass": "*",
+    "stylus": "*"
+  },
+  "peerDependenciesMeta": {
+    "less": {
+      "optional": true
+    },
+    "sass": {
+      "optional": true
+    },
+    "stylus": {
+      "optional": true
+    }
   },
   "dependencies": {
     "@mdx-js/esbuild": "^2.1.1",
     "@mdx-js/rollup": "^2.1.1",
+    "@qrac/svgstore": "^3.0.3",
     "@svgr/core": "^6.2.1",
     "@vitejs/plugin-react": "^1.3.2",
     "cac": "^6.7.12",
     "deepmerge-ts": "^4.0.3",
-    "esbuild": "^0.14.38",
+    "esbuild": "^0.14.42",
+    "fast-glob": "^3.2.11",
     "fs-extra": "^10.1.0",
     "js-beautify": "^1.14.3",
     "mime-types": "^2.1.35",
-    "node-fetch": "^3.2.4",
+    "node-fetch": "^3.2.5",
     "node-html-parser": "^5.3.3",
     "picocolors": "^1.0.0",
+    "postcss": "^8.4.14",
+    "postcss-modules": "^4.3.1",
     "react-helmet": "^6.1.0",
     "react-router-dom": "^6.3.0",
     "rehype-highlight": "^5.0.2",
@@ -91,24 +109,27 @@
     "remark-gfm": "^3.0.1",
     "remark-mdx-frontmatter": "^1.1.1",
     "srcset": "^5.0.0",
-    "svgstore": "^3.0.1",
-    "tiny-glob": "^0.2.9",
     "uuid": "^8.3.2",
-    "vite": "^2.9.8"
+    "vite": "^2.9.9"
   },
   "devDependencies": {
     "@types/fs-extra": "^9.0.13",
     "@types/js-beautify": "^1.13.3",
+    "@types/less": "^3.0.3",
     "@types/mime-types": "^2.1.1",
-    "@types/node": "^17.0.31",
+    "@types/node": "^17.0.39",
     "@types/react": "^17.0.45",
     "@types/react-dom": "^17.0.16",
     "@types/react-helmet": "^6.1.5",
+    "@types/stylus": "^0.48.38",
     "@types/uuid": "^8.3.4",
+    "less": "^4.1.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "tsup": "^5.12.7",
-    "typescript": "^4.6.4",
-    "vitest": "^0.12.0"
+    "sass": "^1.52.2",
+    "stylus": "^0.58.1",
+    "tsup": "^6.0.1",
+    "typescript": "^4.7.3",
+    "vitest": "^0.13.1"
   }
 }