Skip to content

qrac/minista

 
 

Repository files navigation

minista

Site & Documentation

https://minista.qranoko.jp

About

minista(ミニスタ)は、React の JSX で書けるスタティックサイトジェネレーターです。Next.js 風の快適な環境で開発しながら 100% 静的な出力を行えます。SaaS の web テンプレートコーディング業務を想定しているため、ビルド後のデータが綺麗(ヒューマンリーダブル)です。

How To Use

Automatic Setup

$ npm init minista@latest

Manual Setup

$ npm install --save-dev minista react react-dom
public # Copy dist
src
└── pages # Required!
    ├── about
    │   └── index.jsx
    └── index.jsx
const PageHome = () => {
  return (
    <h1>Home</h1>
  )
}

export default PageHome

package.json を開き、以下のスクリプトを追加します。

"scripts": {
  "dev": "minista",
  "build": "minista build",
  "preview": "minista preview",
}

Commands

command detail
minista Development mode, Press Ctrl+C to stop
minista build Static site generate
minista preview Static data preview

Customize

// minista.config.ts
import { defineConfig } from "minista"

export default defineConfig({
  base: "/", // string
  public: "public", // string
  out: "dist", // string
  root: {
    srcDir: "src", // string
    srcName: "root", // string
    srcExt: ["tsx", "jsx"], // string[]
  },
  pages: {
    srcDir: "src/pages", // string
    srcExt: ["tsx", "jsx", "md", "mdx"], // string[]
  },
  assets: {
    entry: "", // string | string[] | { [key: string]: string }
    outDir: "assets", // string
    bundle: {
      outName: "bundle", // string
    },
    images: {
      outDir: "assets/images", // string
      outName: "[name]", // string
    },
    fonts: {
      outDir: "assets/fonts", // string
      outName: "[name]", // string
    },
    svgr: {
      svgrOptions: {}, // https://react-svgr.com/docs/options/
    },
    icons: {
      useSprite: true, // boolean
      srcDir: "src/assets/icons", // string
      outDir: "assets/images", // string
      outName: "icons", // string
      svgstoreOptions: {
        cleanSymbols: ["fill", "stroke", "stroke-linejoin", "stroke-width"],
      }, // https://github.com/svgstore/svgstore#svgstore-options
    },
    download: {
      useRemote: false, // boolean
      remoteUrl: ["https://", "http://"], // string[]
      remoteName: "remote-[index]", // string
      outDir: "assets/images", // string
    },
  },
  vite: {}, // https://vitejs.dev/config/
  markdown: {
    syntaxHighlighter: "highlight", // "highlight" | "none"
    highlightOptions: {}, // https://github.com/rehypejs/rehype-highlight#options
    mdxOptions: {
      remarkPlugins: [], // https://mdxjs.com/packages/mdx/#optionsremarkplugins
      rehypePlugins: [], // https://mdxjs.com/packages/mdx/#optionsrehypeplugins
    },
  },
  beautify: {
    useHtml: true, // boolean
    useAssets: false, // boolean
    htmlOptions: {
      indent_size: 2,
      max_preserve_newlines: 0,
      indent_inner_html: true,
      extra_liners: [],
      inline: ["span", "b", "br", "code", "del", "s", "small", "strong", "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
  },
})

Libraries

Media

Respect

License

  • MIT

Credit

About

Static site generator with 100% static export from React and Vite.

Topics

Resources

Stars

Watchers

Forks

Packages

 
 
 

Contributors