@intlayer/docs 8.5.0 → 8.5.2

package/docs/ja/intlayer_with_tanstack.md

@@ -217,7 +217,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>

package/docs/ja/intlayer_with_vite+lit.md

@@ -24,6 +24,14 @@ history:
 
 # Intlayerを使用してViteとLitのウェブサイトを翻訳する | 国際化 (i18n)
 
+<iframe
+  src="https://stackblitz.com/github/aymericzip/intlayer-vite-lit-template?embed=1&ctl=1&file=intlayer.config.ts"
+  className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
+  title="Demo CodeSandbox - How to Internationalize your application using Intlayer"
+  sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
+  loading="lazy"
+/>
+
 ## 目次
 
 <TOC/>
@@ -68,7 +76,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer lit-intlayer
 bun add vite-intlayer --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**
@@ -640,63 +648,6 @@ const config: IntlayerConfig = {
 export default config;
 ```
 
-<Tabs>
- <Tab value='抽出コマンド'>
-
-抽出器を実行してコンポーネントを変換し、コンテンツを抽出します
-
-```bash packageManager="npm"
-npx intlayer extract
-```
-
-```bash packageManager="pnpm"
-pnpm intlayer extract
-```
-
-```bash packageManager="yarn"
-yarn intlayer extract
-```
-
-```bash packageManager="bun"
-bunx intlayer extract
-```
-
- </Tab>
- <Tab value='Babelコンパイラ'>
-
-`vite.config.ts` を更新して `intlayerCompiler` プラグインを含めます：
-
-```ts fileName="vite.config.ts"
-import { defineConfig } from "vite";
-import { intlayer, intlayerCompiler } from "vite-intlayer";
-
-export default defineConfig({
-  plugins: [
-    intlayer(),
-    intlayerCompiler(), // コンパイラプラグインを追加
-  ],
-});
-```
-
-```bash packageManager="npm"
-npm run build # または npm run dev
-```
-
-```bash packageManager="pnpm"
-pnpm run build # または pnpm run dev
-```
-
-```bash packageManager="yarn"
-yarn build # または yarn dev
-```
-
-```bash packageManager="bun"
-bun run build # または bun run dev
-```
-
- </Tab>
-</Tabs>
-
 ### TypeScriptの設定
 
 TypeScriptの設定に自動生成された型が含まれていることを確認してください。

package/docs/ja/intlayer_with_vite+preact.md

@@ -181,7 +181,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>

package/docs/ja/intlayer_with_vite+react.md

@@ -160,7 +160,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>

package/docs/ja/intlayer_with_vite+react_compiler.md

@@ -102,7 +102,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer react-intlayer
 bun add vite-intlayer --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**

package/docs/ja/intlayer_with_vite+solid.md

@@ -97,7 +97,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer solid-intlayer
 bun add vite-intlayer --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**
@@ -721,7 +721,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>

package/docs/ja/intlayer_with_vite+svelte.md

@@ -83,7 +83,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer svelte-intlayer
 bun add vite-intlayer --save-dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**
@@ -622,7 +622,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>

package/docs/ja/intlayer_with_vite+vanilla.md

@@ -69,7 +69,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer vanilla-intlayer
 bun add vite-intlayer --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**
@@ -637,7 +637,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>

package/docs/ja/intlayer_with_vite+vue.md

@@ -90,7 +90,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer vue-intlayer
 bun add vite-intlayer --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**
@@ -438,14 +438,14 @@ Vueアプリケーション全体でIntlayerの国際化機能を利用するに
 
 ```javascript fileName=main.js
 import { createApp } from "vue";
-import { installIntlayer } from "vue-intlayer";
+import { intlayer } from "vue-intlayer";
 import App from "./App.vue";
 import "./style.css";
 
 const app = createApp(App);
 
 // 最上位でプロバイダーを注入
-installIntlayer(app);
+app.use(intlayer);
 
 // アプリをマウント
 app.mount("#app");
@@ -1029,7 +1029,7 @@ import { installIntlayer, installIntlayerMarkdown } from "vue-intlayer";
 
 const app = createApp(App);
 
-installIntlayer(app);
+app.use(intlayer);
 
 const md = new MarkdownIt({
   html: true, // HTMLタグを許可
@@ -1225,7 +1225,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>

package/docs/ko/dictionary/html.md

@@ -19,6 +19,9 @@ slugs:
   - content
   - html
 history:
+  - version: 8.5.0
+    date: 2026-03-24
+    changes: "Add `intlayerHTML` plugin object; use `app.use(intlayerHTML)` instead of `app.use(installIntlayerHTML)`"
   - version: 8.5.0
     date: 2026-03-24
     changes: "{{framework}}-intlayer에서 {{framework}}-intlayer/html으로 임포트 이동"
@@ -281,14 +284,14 @@ HTML 노드에서 `.use()` 메서드를 사용할 때, 제공하는 컴포넌트
 
     ```typescript fileName="main.ts"
     import { createApp, h } from "vue";
-    import { installIntlayer } from "vue-intlayer";
-    import { installIntlayerHTML } from "vue-intlayer/html";
+    import { intlayer } from "vue-intlayer";
+    import { intlayerHTML } from "vue-intlayer/html";
     import App from "./App.vue";
 
     const app = createApp(App);
 
-    app.use(installIntlayer);
-    app.use(installIntlayerHTML, {
+    app.use(intlayer);
+    app.use(intlayerHTML, {
       components: {
         p: (props, { slots }) => h("p", { class: "prose", ...props }, slots.default?.()),
         CustomLink: (props, { slots }) => h("a", { href: "/details", ...props }, slots.default?.()),
@@ -302,14 +305,14 @@ HTML 노드에서 `.use()` 메서드를 사용할 때, 제공하는 컴포넌트
 
     ```typescript fileName="main.ts"
     import { createApp, h } from "vue";
-    import { installIntlayer } from "vue-intlayer";
-    import { installIntlayerHTML } from "vue-intlayer/html";
+    import { intlayer } from "vue-intlayer";
+    import { intlayerHTML } from "vue-intlayer/html";
     import App from "./App.vue";
 
     const app = createApp(App);
 
-    app.use(installIntlayer);
-    app.use(installIntlayerHTML, {
+    app.use(intlayer);
+    app.use(intlayerHTML, {
       renderHTML: async (html) => {
         const { renderHTML } = await import('vue-intlayer/html');
         return renderHTML(html);

package/docs/ko/dictionary/markdown.md

@@ -17,6 +17,9 @@ slugs:
   - content
   - markdown
 history:
+  - version: 8.5.0
+    date: 2026-03-24
+    changes: "Add `intlayerMarkdown` plugin object; use `app.use(intlayerMarkdown)` instead of `app.use(installIntlayerMarkdown)`"
   - version: 8.5.0
     date: 2026-03-24
     changes: "{{framework}}-intlayer에서 {{framework}}-intlayer/markdown으로 임포트 이동"
@@ -35,7 +38,7 @@ history:
 
 Intlayer는 마크다운 문법을 사용하여 정의된 리치 텍스트 콘텐츠를 지원합니다. 이를 통해 블로그, 기사 등과 같은 리치 포맷의 콘텐츠를 쉽게 작성하고 관리할 수 있습니다.
 
-## 파트 1: 마크다운 콘텐츠 선언
+## 마크다운 콘텐츠 선언
 
 마크다운 콘텐츠는 `md` 함수를 사용하거나 (마크다운 문법을 포함하는 경우) 단순히 문자열로 선언할 수 있습니다.
 
@@ -93,7 +96,7 @@ Intlayer는 마크다운 문법을 사용하여 정의된 리치 텍스트 콘
 
 ---
 
-## 파트 2: 마크다운 렌더링
+## 마크다운 렌더링
 
 렌더링은 Intlayer의 콘텐츠 시스템을 통해 자동으로 처리하거나, 전문 도구를 사용해 수동으로 처리할 수 있습니다.
 
@@ -386,8 +389,6 @@ Intlayer는 마크다운 문법을 사용하여 정의된 리치 텍스트 콘
 
     export const AppProvider = ({ children }) => (
       <MarkdownProvider
-        forceBlock={true}
-        tagfilter={true}
         components={{
           h1: ({ children }) => <h1 className="text-2xl font-bold">{children}</h1>,
           a: ({ href, children }) => <Link to={href}>{children}</Link>,
@@ -422,21 +423,20 @@ Intlayer는 마크다운 문법을 사용하여 정의된 리치 텍스트 콘
 
     ```typescript fileName="main.ts"
     import { createApp } from "vue";
-    import { installIntlayer } from "vue-intlayer";
-    import { installIntlayerMarkdown } from "vue-intlayer/markdown";
+    import { intlayer } from "vue-intlayer";
+    import { intlayerMarkdown } from "vue-intlayer/markdown";
     import App from "./App.vue";
 
     const app = createApp(App);
 
-    app.use(installIntlayer);
-    app.use(installIntlayerMarkdown, {
-      forceBlock: true,
-      tagfilter: true,
+    app.use(intlayer);
+    app.use(intlayerMarkdown, {
       components: {
-        h1: {
-          component: "h1",
-          props: { class: "text-2xl font-bold" },
-        },
+        h1: (props) =>
+        h('h1', { style: { color: 'orange' }, ...props }, props.children),
+        ComponentDemo: () => h('div', { style: { background: 'grey' } }, 'DEMO'),
+        bold: (props) => h('strong', props),
+        code: (props) => h('code', props),
       },
     });
 
@@ -447,14 +447,14 @@ Intlayer는 마크다운 문법을 사용하여 정의된 리치 텍스트 콘
 
     ```typescript fileName="main.ts"
     import { createApp } from "vue";
-    import { installIntlayer } from "vue-intlayer";
-    import { installIntlayerMarkdown } from "vue-intlayer/markdown";
+    import { intlayer } from "vue-intlayer";
+    import { intlayerMarkdown } from "vue-intlayer/markdown";
     import App from "./App.vue";
 
     const app = createApp(App);
 
-    app.use(installIntlayer);
-    app.use(installIntlayerMarkdown, {
+    app.use(intlayer);
+    app.use(intlayerMarkdown, {
       renderMarkdown: async (md) => {
         const { compileMarkdown } = await import('vue-intlayer/markdown');
         return compileMarkdown(md);
@@ -476,8 +476,6 @@ Intlayer는 마크다운 문법을 사용하여 정의된 리치 텍스트 콘
     </script>
 
     <MarkdownProvider
-      forceBlock={true}
-      tagfilter={true}
       components={{
         h1: MyHeading,
       }}
@@ -513,8 +511,6 @@ Intlayer는 마크다운 문법을 사용하여 정의된 리치 텍스트 콘
 
     export const AppProvider = ({ children }) => (
       <MarkdownProvider
-        forceBlock={true}
-        tagfilter={true}
         components={{
           h1: ({ children }) => <h1 className="text-2xl font-bold">{children}</h1>,
         }}
@@ -551,8 +547,6 @@ Intlayer는 마크다운 문법을 사용하여 정의된 리치 텍스트 콘
 
     export const AppProvider = (props) => (
       <MarkdownProvider
-        forceBlock={true}
-        tagfilter={true}
         components={{
           h1: (props) => <h1 className="text-2xl font-bold">{props.children}</h1>,
         }}

package/docs/ko/intlayer_CMS.md

@@ -86,7 +86,7 @@ pnpm intlayer login
 ```
 
 ```bash packageManager="bun"
-bunx intlayer login
+bun x intlayer login
 ```
 
 이렇게 하면 기본 브라우저가 열려 인증 프로세스를 완료하고 Intlayer 서비스를 사용하는 데 필요한 자격 증명(Client ID 및 Client Secret)을 받을 수 있습니다.

package/docs/ko/intlayer_with_adonisjs.md

@@ -72,7 +72,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer adonis-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 ### 설정

package/docs/ko/intlayer_with_analog.md

@@ -23,6 +23,14 @@ history:
 
 # Intlayer를 사용하여 Analog (Angular) 앱 번역하기 | 국제화 (i18n)
 
+<iframe
+  src="https://stackblitz.com/github/aymericzip/intlayer-analog-template?embed=1&ctl=1&file=intlayer.config.ts"
+  className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
+  title="Demo CodeSandbox - How to Internationalize your application using Intlayer"
+  sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
+  loading="lazy"
+/>
+
 ## 목차
 
 <TOC/>
@@ -42,20 +50,6 @@ Intlayer를 사용하면 다음을 할 수 있습니다:
 
 ## Analog 애플리케이션에 Intlayer를 설정하는 단계별 가이드
 
-<Tabs defaultTab="code">
-  <Tab label="코드" value="code">
-
-<iframe
-  src="https://stackblitz.com/github/aymericzip/intlayer/tree/main/examples/vite-analog-app?embed=1&ctl=1&file=intlayer.config.ts"
-  className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
-  title="Demo CodeSandbox - How to Internationalize your application using Intlayer"
-  sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
-  loading="lazy"
-/>
-
-  </Tab>
-</Tabs>
-
 GitHub에서 [애플리케이션 템플릿](https://github.com/aymericzip/intlayer-analog-template)을 확인하세요.
 
 ### 1단계: 종속성 설치
@@ -79,7 +73,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer angular-intlayer vite-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**

package/docs/ko/intlayer_with_angular.md

@@ -85,7 +85,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer angular-intlayer
 bun add @angular-builders/custom-webpack --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**

package/docs/ko/intlayer_with_create_react_app.md

@@ -63,7 +63,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer react-intlayer react-scripts-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**

package/docs/ko/intlayer_with_express.md

@@ -77,7 +77,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer express-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 ### 설정

package/docs/ko/intlayer_with_fastify.md

@@ -76,7 +76,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer fastify-intlayer
-bunx intlayer init
+bun x intlayer init
 
 ```
 

package/docs/ko/intlayer_with_hono.md

@@ -75,7 +75,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer hono-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 ### 설정

package/docs/ko/intlayer_with_lynx+react.md

@@ -63,7 +63,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer react-intlayer lynx-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 ### 패키지

package/docs/ko/intlayer_with_nestjs.md

@@ -87,7 +87,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer express-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 ### tsconfig.json 구성

package/docs/ko/intlayer_with_next-i18next.md

@@ -572,7 +572,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer @intlayer/sync-json-plugin --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 ```ts fileName="intlayer.config.ts"

package/docs/ko/intlayer_with_next-intl.md

@@ -408,7 +408,7 @@ pnpm add intlayer @intlayer/sync-json-plugin --save-dev
 
 ```bash packageManager="bun"
 bun add intlayer @intlayer/sync-json-plugin --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 intlayer 구성 파일을 생성하세요:

package/docs/ko/intlayer_with_nextjs_14.md

@@ -57,7 +57,7 @@ npm install intlayer next-intlayer
 
 ```bash packageManager="bun"
 bun add intlayer next-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 ```/bash packageManager="pnpm"

package/docs/ko/intlayer_with_nextjs_15.md

@@ -71,7 +71,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer next-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**

package/docs/ko/intlayer_with_nextjs_16.md

@@ -96,7 +96,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer next-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**
@@ -1555,7 +1555,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>

package/docs/ko/intlayer_with_nextjs_compiler.md

@@ -103,7 +103,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer next-intlayer
 bun add @intlayer/babel --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**
@@ -612,7 +612,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>

package/docs/ko/intlayer_with_nextjs_no_locale_path.md

@@ -89,7 +89,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer next-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**

package/docs/ko/intlayer_with_nextjs_page_router.md

@@ -65,7 +65,7 @@ yarn intlayer init
 
 ```bash packageManager="bun"
 bun add intlayer next-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**

package/docs/ko/intlayer_with_nuxt.md

@@ -92,7 +92,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer vue-intlayer
 bun add --dev nuxt-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**

package/docs/ko/intlayer_with_react_native+expo.md

@@ -66,7 +66,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer react-intlayer
 bun add --dev react-native-intlayer
-bunx intlayer init
+bun x intlayer init
 ```
 
 ### 패키지

package/docs/ko/intlayer_with_react_router_v7.md

@@ -83,7 +83,7 @@ yarn intlayer init
 ```bash packageManager="bun"
 bun add intlayer react-intlayer
 bun add vite-intlayer --dev
-bunx intlayer init
+bun x intlayer init
 ```
 
 - **intlayer**
@@ -621,7 +621,7 @@ yarn intlayer extract
 ```
 
 ```bash packageManager="bun"
-bunx intlayer extract
+bun x intlayer extract
 ```
 
  </Tab>