minista 1.2.0 → 2.0.0-alpha.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +34 -321
- package/bin/minista.js +10 -0
- package/dist/app.d.ts +1 -0
- package/dist/app.js +7 -0
- package/dist/build.d.ts +30 -0
- package/dist/build.js +239 -0
- package/dist/clean.d.ts +3 -0
- package/dist/clean.js +25 -0
- package/dist/cli.d.ts +1 -0
- package/dist/cli.js +123 -0
- package/dist/config.d.ts +33 -0
- package/dist/config.js +49 -0
- package/dist/define.d.ts +2 -0
- package/dist/define.js +7 -0
- package/dist/empty.d.ts +1 -0
- package/dist/empty.js +10 -0
- package/dist/esbuild.d.ts +5 -0
- package/dist/esbuild.js +38 -0
- package/dist/head.d.ts +4 -0
- package/dist/head.js +37 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.js +6 -0
- package/dist/link.d.ts +4 -0
- package/dist/link.js +46 -0
- package/dist/main.d.ts +4 -0
- package/dist/main.js +5 -0
- package/dist/mdx.d.ts +4 -0
- package/dist/mdx.js +37 -0
- package/dist/migrate.d.ts +1 -0
- package/dist/migrate.js +7 -0
- package/dist/optimize.d.ts +1 -0
- package/dist/optimize.js +13 -0
- package/dist/page.d.ts +10 -0
- package/dist/page.js +130 -0
- package/dist/pages.d.ts +1 -0
- package/dist/pages.js +45 -0
- package/dist/path.d.ts +3 -0
- package/dist/path.js +26 -0
- package/dist/preview.d.ts +2 -0
- package/dist/preview.js +9 -0
- package/dist/render.d.ts +2 -0
- package/{main.js → dist/render.js} +13 -15
- package/dist/server.d.ts +2 -0
- package/dist/server.js +10 -0
- package/dist/types.d.ts +45 -0
- package/dist/types.js +1 -0
- package/dist/user.d.ts +46 -0
- package/dist/user.js +87 -0
- package/dist/utils.d.ts +220 -0
- package/dist/utils.js +56 -0
- package/dist/vite.d.ts +8 -0
- package/dist/vite.js +136 -0
- package/lib/index.html +22 -0
- package/lib/shim-fetch.js +2 -0
- package/lib/shim-react.js +2 -0
- package/package.json +51 -35
- package/cli.js +0 -163
- package/index.d.ts +0 -4
- package/webpack.config.js +0 -279
package/README.md
CHANGED
|
@@ -14,362 +14,75 @@
|
|
|
14
14
|
|
|
15
15
|
## About
|
|
16
16
|
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
- ゼロコンフィグで始められる
|
|
20
|
-
- React (TSX/JSX)から 100%静的な HTML を出力
|
|
21
|
-
- CSS と JavaScript を個別に Minify 出力
|
|
22
|
-
- SVG スプライトアイコンを自動生成
|
|
23
|
-
- Next.js 風のディレクトリ構成
|
|
17
|
+
Next.js Like Development with 100% Static Generate.
|
|
24
18
|
|
|
25
19
|
## How To Use
|
|
26
20
|
|
|
27
|
-
### Automatic
|
|
28
|
-
|
|
29
|
-
コマンド `npm init minista` を入力するだけでいくつかのテンプレートから選び始められます。テンプレートは[オフィシャル](https://github.com/qrac/create-minista/tree/main/templates)以外にも任意の GitHub パブリックリポジトリに対応していますので、自分用のテンプレートを作っておくと効率的です。
|
|
30
|
-
|
|
31
|
-
```bash
|
|
32
|
-
# Use interactive CLI
|
|
33
|
-
npm init minista
|
|
34
|
-
|
|
35
|
-
# Use Official Template
|
|
36
|
-
npm init minista -- --template [OFFICIAL_TEMPLATE_NAME]
|
|
37
|
-
|
|
38
|
-
# Use GitHub Template
|
|
39
|
-
npm init minista -- --template [GITHUB_USER]/[REPO_NAME]
|
|
40
|
-
npm init minista -- --template [GITHUB_USER]/[REPO_NAME]/path/to/example
|
|
41
|
-
```
|
|
42
|
-
|
|
43
|
-
- `create-minista`: [repo](https://github.com/qrac/create-minista) / [npm](https://www.npmjs.com/package/create-minista)
|
|
44
|
-
|
|
45
|
-
### Manual
|
|
21
|
+
### Automatic Setup
|
|
46
22
|
|
|
47
|
-
|
|
23
|
+
not supported
|
|
48
24
|
|
|
49
|
-
|
|
25
|
+
### Manual Setup
|
|
50
26
|
|
|
51
27
|
```bash
|
|
52
|
-
$ npm install --save-dev minista react react-dom
|
|
28
|
+
$ npm install --save-dev minista@next react react-dom
|
|
53
29
|
```
|
|
54
30
|
|
|
55
31
|
```bash
|
|
56
|
-
#
|
|
57
|
-
# Directory Example
|
|
58
|
-
# ----------------------------------------------------
|
|
59
|
-
|
|
60
|
-
public # Copy root
|
|
32
|
+
public # Copy dist
|
|
61
33
|
src
|
|
62
|
-
├── assets
|
|
63
|
-
│ └── index.js # Required!
|
|
64
|
-
├── components
|
|
65
|
-
│ └── layout.js
|
|
66
34
|
└── pages # Required!
|
|
67
35
|
├── about
|
|
68
|
-
│ └── index.
|
|
69
|
-
└── index.
|
|
70
|
-
```
|
|
71
|
-
|
|
72
|
-
<!-- prettier-ignore -->
|
|
73
|
-
```js
|
|
74
|
-
//----------------------------------------------------
|
|
75
|
-
// Page Example
|
|
76
|
-
//----------------------------------------------------
|
|
77
|
-
|
|
78
|
-
import { render } from "minista" // Required!
|
|
79
|
-
|
|
80
|
-
const PageHome = () => {
|
|
81
|
-
return (
|
|
82
|
-
<h1>Hello</h1>
|
|
83
|
-
)
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
export default render(<PageHome />) // Required!
|
|
87
|
-
```
|
|
88
|
-
|
|
89
|
-
## Commands
|
|
90
|
-
|
|
91
|
-
### Develop
|
|
92
|
-
|
|
93
|
-
`webpack-dev-server` でプレビューします。
|
|
94
|
-
|
|
95
|
-
```bash
|
|
96
|
-
# Start
|
|
97
|
-
$ minista
|
|
98
|
-
|
|
99
|
-
# Stop
|
|
100
|
-
Press Ctrl+C
|
|
101
|
-
```
|
|
102
|
-
|
|
103
|
-
### Build
|
|
104
|
-
|
|
105
|
-
納品用にビルド。HTML には `js-beautify` 処理が施され見やすくなります。
|
|
106
|
-
|
|
107
|
-
```bash
|
|
108
|
-
$ minista build
|
|
36
|
+
│ └── index.tsx
|
|
37
|
+
└── index.tsx
|
|
109
38
|
```
|
|
110
39
|
|
|
111
|
-
## Components
|
|
112
|
-
|
|
113
|
-
### Comment
|
|
114
|
-
|
|
115
|
-
`<Comment text="" />` を使うと React では作りにくい HTML コメントが残せます。
|
|
116
|
-
|
|
117
40
|
<!-- prettier-ignore -->
|
|
118
41
|
```js
|
|
119
|
-
import { render, Comment } from "minista"
|
|
120
|
-
|
|
121
42
|
const PageHome = () => {
|
|
122
43
|
return (
|
|
123
|
-
|
|
124
|
-
<Comment text="Comment Test" />
|
|
125
|
-
<h1>Hello</h1>
|
|
126
|
-
</>
|
|
44
|
+
<h1>Home</h1>
|
|
127
45
|
)
|
|
128
46
|
}
|
|
129
47
|
|
|
130
|
-
export default
|
|
131
|
-
```
|
|
132
|
-
|
|
133
|
-
```html
|
|
134
|
-
<body>
|
|
135
|
-
<!-- Comment Test -->
|
|
136
|
-
<h1>Hello</h1>
|
|
137
|
-
</body>
|
|
138
|
-
```
|
|
139
|
-
|
|
140
|
-
### Sitemap
|
|
141
|
-
|
|
142
|
-
納品用のサイトマップを簡単に作るコンポーネントを npm で追加可能です。納品物に追加の CSS や JavaScript をバンドルさせません。
|
|
143
|
-
|
|
144
|
-
- `minista-sitemap`: [repo](https://github.com/qrac/minista-sitemap) / [npm](https://www.npmjs.com/package/minista-sitemap)
|
|
145
|
-
|
|
146
|
-
## Customize
|
|
147
|
-
|
|
148
|
-
### webpack
|
|
149
|
-
|
|
150
|
-
プロジェクトの root に `webpack.config.js` を配置することで設定をマージできます。
|
|
151
|
-
|
|
152
|
-
```js
|
|
153
|
-
//----------------------------------------------------
|
|
154
|
-
// Example: User > webpack.config.js
|
|
155
|
-
//----------------------------------------------------
|
|
156
|
-
|
|
157
|
-
// No installation required.
|
|
158
|
-
const MiniCssExtractPlugin = require("mini-css-extract-plugin")
|
|
159
|
-
const CopyPlugin = require("copy-webpack-plugin")
|
|
160
|
-
|
|
161
|
-
const webpackConfig = {
|
|
162
|
-
// Merge
|
|
163
|
-
devServer: {
|
|
164
|
-
open: ["/index.html"],
|
|
165
|
-
},
|
|
166
|
-
// Replace
|
|
167
|
-
entry: { custom: "./src/assets/index.js" },
|
|
168
|
-
module: {
|
|
169
|
-
rules: [
|
|
170
|
-
// Merge: loader options
|
|
171
|
-
{
|
|
172
|
-
test: /\.css$/,
|
|
173
|
-
use: [
|
|
174
|
-
{
|
|
175
|
-
loader: "css-loader",
|
|
176
|
-
options: {
|
|
177
|
-
url: false,
|
|
178
|
-
},
|
|
179
|
-
},
|
|
180
|
-
],
|
|
181
|
-
},
|
|
182
|
-
],
|
|
183
|
-
},
|
|
184
|
-
plugins: [
|
|
185
|
-
// Replace
|
|
186
|
-
new MiniCssExtractPlugin({
|
|
187
|
-
filename: "assets/css/[name].css",
|
|
188
|
-
}),
|
|
189
|
-
// Replace
|
|
190
|
-
new CopyPlugin({
|
|
191
|
-
patterns: [{ from: "./static", to: "./", noErrorOnMissing: true }],
|
|
192
|
-
}),
|
|
193
|
-
],
|
|
194
|
-
optimization: {
|
|
195
|
-
minimizer: [
|
|
196
|
-
/* Replace plugins */
|
|
197
|
-
],
|
|
198
|
-
},
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
module.exports = webpackConfig
|
|
48
|
+
export default PageHome
|
|
202
49
|
```
|
|
203
50
|
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
TypeScript `.tsx` でページを作成する場合はモジュールを追加し `tsconfig.json` をプロジェクトの root に配置。エントリーポイントとして `src/assets/index.ts` があれば `src/assets/index.js` の代わりに使用します。
|
|
207
|
-
|
|
208
|
-
```bash
|
|
209
|
-
$ npm install --save-dev typescript @types/react @types/react-dom
|
|
210
|
-
```
|
|
51
|
+
Open `package.json` and add the following scripts:
|
|
211
52
|
|
|
212
53
|
```json
|
|
213
|
-
{
|
|
214
|
-
"
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
"baseUrl": ".",
|
|
218
|
-
"allowJs": true,
|
|
219
|
-
"strict": true,
|
|
220
|
-
"noImplicitAny": false,
|
|
221
|
-
"strictNullChecks": true,
|
|
222
|
-
"noUnusedLocals": true,
|
|
223
|
-
"noUnusedParameters": true,
|
|
224
|
-
"noImplicitReturns": true,
|
|
225
|
-
"moduleResolution": "node",
|
|
226
|
-
"esModuleInterop": true,
|
|
227
|
-
"isolatedModules": false,
|
|
228
|
-
"skipLibCheck": true,
|
|
229
|
-
"forceConsistentCasingInFileNames": true,
|
|
230
|
-
"resolveJsonModule": true,
|
|
231
|
-
"jsx": "react-jsx"
|
|
232
|
-
},
|
|
233
|
-
"include": ["**/*.ts", "**/*.tsx"],
|
|
234
|
-
"exclude": ["node_modules", "dist", "webpack.config.js"]
|
|
235
|
-
}
|
|
236
|
-
```
|
|
237
|
-
|
|
238
|
-
```bash
|
|
239
|
-
# ----------------------------------------------------
|
|
240
|
-
# Directory Example
|
|
241
|
-
# ----------------------------------------------------
|
|
242
|
-
|
|
243
|
-
public # Copy root
|
|
244
|
-
src
|
|
245
|
-
├── assets
|
|
246
|
-
│ └── index.ts (or index.js) # Required!
|
|
247
|
-
├── components
|
|
248
|
-
│ └── layout.js
|
|
249
|
-
└── pages # Required!
|
|
250
|
-
├── about
|
|
251
|
-
│ └── index.tsx
|
|
252
|
-
└── index.tsx
|
|
253
|
-
```
|
|
254
|
-
|
|
255
|
-
### Babel
|
|
256
|
-
|
|
257
|
-
Babel はプロジェクトの root に `.babelrc` もしくは `babel.config.js` を配置することで設定を上書きできます。カスタマイズしない場合は以下の設定が適応されます。
|
|
258
|
-
|
|
259
|
-
```js
|
|
260
|
-
// JavaScript
|
|
261
|
-
const babelJsxOptions = {
|
|
262
|
-
presets: [
|
|
263
|
-
"@babel/preset-env",
|
|
264
|
-
[
|
|
265
|
-
"@babel/preset-react",
|
|
266
|
-
{
|
|
267
|
-
runtime: "automatic",
|
|
268
|
-
},
|
|
269
|
-
],
|
|
270
|
-
],
|
|
271
|
-
}
|
|
272
|
-
|
|
273
|
-
// TypeScript
|
|
274
|
-
const babelTsxOptions = {
|
|
275
|
-
presets: [
|
|
276
|
-
"@babel/preset-env",
|
|
277
|
-
[
|
|
278
|
-
"@babel/preset-react",
|
|
279
|
-
{
|
|
280
|
-
runtime: "automatic",
|
|
281
|
-
},
|
|
282
|
-
],
|
|
283
|
-
["@babel/preset-typescript"],
|
|
284
|
-
],
|
|
285
|
-
}
|
|
286
|
-
```
|
|
287
|
-
|
|
288
|
-
### PostCSS
|
|
289
|
-
|
|
290
|
-
PostCSS はゼロコンフィグで以下のプラグインが適応されますが、プロジェクトの root に `postcss.config.js` を配置することで設定を上書きできます。
|
|
291
|
-
|
|
292
|
-
```js
|
|
293
|
-
module.exports = {
|
|
294
|
-
plugins: [
|
|
295
|
-
"postcss-import",
|
|
296
|
-
"postcss-flexbugs-fixes",
|
|
297
|
-
"postcss-sort-media-queries",
|
|
298
|
-
"postcss-preset-env",
|
|
299
|
-
],
|
|
54
|
+
"scripts": {
|
|
55
|
+
"dev": "minista",
|
|
56
|
+
"build": "minista build",
|
|
57
|
+
"preview": "minista preview",
|
|
300
58
|
}
|
|
301
59
|
```
|
|
302
60
|
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
`sass-loader` と `sass`（または `node-sass`）を追加することで使えます。
|
|
306
|
-
|
|
307
|
-
```bash
|
|
308
|
-
$ npm install --save-dev sass-loader sass
|
|
309
|
-
```
|
|
310
|
-
|
|
311
|
-
### Style only
|
|
312
|
-
|
|
313
|
-
プロジェクトに JavaScript が全く必要ない場合はエントリーポイントを CSS ファイルに変更します。これにより空の JavaScript ファイルを出力することなく納品用データを生成できます。
|
|
314
|
-
|
|
315
|
-
```js
|
|
316
|
-
//----------------------------------------------------
|
|
317
|
-
// Example: User > webpack.config.js
|
|
318
|
-
//----------------------------------------------------
|
|
319
|
-
|
|
320
|
-
const webpackConfig = {
|
|
321
|
-
entry: { bundle: "./src/assets/index.css" },
|
|
322
|
-
}
|
|
323
|
-
|
|
324
|
-
module.exports = webpackConfig
|
|
325
|
-
```
|
|
61
|
+
## Commands
|
|
326
62
|
|
|
327
|
-
|
|
63
|
+
| command | detail |
|
|
64
|
+
| ----------------- | -------------------------------------- |
|
|
65
|
+
| `minista` | Development mode, Press Ctrl+C to stop |
|
|
66
|
+
| `minista build` | Static site generate |
|
|
67
|
+
| `minista preview` | Static data preview |
|
|
328
68
|
|
|
329
|
-
|
|
69
|
+
## Customize
|
|
330
70
|
|
|
331
71
|
```js
|
|
332
|
-
//
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
}
|
|
72
|
+
// minista.config.ts
|
|
73
|
+
import { defineMinistaUserConfig } from "minista"
|
|
74
|
+
|
|
75
|
+
export default defineMinistaUserConfig({
|
|
76
|
+
entry: undefined, // string | string[] | { [key: string]: string }
|
|
77
|
+
outDir: "dist", // string
|
|
78
|
+
publicDir: "public", // string
|
|
79
|
+
assetsDir: "assets", // string
|
|
80
|
+
autoAssetsName: "bundle", // string
|
|
81
|
+
vite: undefined, // https://vitejs.dev/config/
|
|
82
|
+
markdown: { remarkPlugins: [] }, // https://mdxjs.com/packages/mdx/#optionsremarkplugins
|
|
83
|
+
})
|
|
345
84
|
```
|
|
346
85
|
|
|
347
|
-
```html
|
|
348
|
-
<!-- dist html -->
|
|
349
|
-
<svg role="img" class="icon">
|
|
350
|
-
<use xlink:href="/assets/icons.svg#star"></use>
|
|
351
|
-
</svg>
|
|
352
|
-
```
|
|
353
|
-
|
|
354
|
-
## Media
|
|
355
|
-
|
|
356
|
-
- [React で書ける SSG 改善点と今後について - minista v1](https://zenn.dev/qrac/articles/a24de970148c7e)
|
|
357
|
-
- [React(JSX)で書けるコーディング用 SSG - minista v0](https://zenn.dev/qrac/articles/7537521afcd1bf)
|
|
358
|
-
|
|
359
|
-
## Respect
|
|
360
|
-
|
|
361
|
-
- [Next.js by Vercel - The React Framework](https://nextjs.org/)
|
|
362
|
-
- [Charge — an opinionated, zero-config static site generator](https://charge.js.org/)
|
|
363
|
-
- [Eleventy, a simpler static site generator.](https://www.11ty.dev/)
|
|
364
|
-
- [Node Interface | webpack](https://webpack.js.org/api/node/)
|
|
365
|
-
- [natemoo-re/microsite](https://github.com/natemoo-re/microsite)
|
|
366
|
-
- [Astro](https://astro.build/)
|
|
367
|
-
- [テンプレートエンジンに React を使いつつ、きれいな HTML を生成したいんじゃ！！](https://zenn.dev/otsukayuhi/articles/e52651b4e2c5ae7c4a17)
|
|
368
|
-
- [EJS をやめて React で HTML を書く](https://zenn.dev/hisho/scraps/4ef6c6106a6395)
|
|
369
|
-
- [MPA(マルチページアプリ)で webpack を使う](https://www.key-p.com/blog/staff/archives/107125)
|
|
370
|
-
- [HTML コーディングでも React+TypeScript の開発体験を得る](https://zenn.dev/nanaki14/articles/html-template-react)
|
|
371
|
-
- [Astro と microCMS でポートフォリオサイトを作る](https://zenn.dev/takanorip/articles/c75717c280c81d)
|
|
372
|
-
|
|
373
86
|
## License
|
|
374
87
|
|
|
375
88
|
- MIT
|
package/bin/minista.js
ADDED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
"use strict"
|
|
3
|
+
|
|
4
|
+
if (typeof __dirname !== "undefined") {
|
|
5
|
+
const version = process.versions.node
|
|
6
|
+
console.error(`\nNode.js v${version} is not supported by minista
|
|
7
|
+
Please upgrade to a version of Node.js with complete ESM support: "^14.15.0 || >=16.0.0"\n`)
|
|
8
|
+
} else {
|
|
9
|
+
import("../dist/cli.js")
|
|
10
|
+
}
|
package/dist/app.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/dist/app.js
ADDED
package/dist/build.d.ts
ADDED
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type { Options as MdxOptions } from "@mdx-js/esbuild";
|
|
2
|
+
import type { InlineConfig } from "vite";
|
|
3
|
+
import type { RootStaticContent, RootJsxContent, GlobalStaticData, GetGlobalStaticData, PageJsxContent, StaticData, StaticDataItem, GetStaticData } from "./types.js";
|
|
4
|
+
export declare function buildTempPages(entryPoints: string[], buildOptions: {
|
|
5
|
+
outbase: string;
|
|
6
|
+
outdir: string;
|
|
7
|
+
mdxConfig: MdxOptions;
|
|
8
|
+
}): Promise<void>;
|
|
9
|
+
export declare function buildStaticPages(entryPoints: string[], tempRootFilePath: string, buildOptions: {
|
|
10
|
+
outbase: string;
|
|
11
|
+
outdir: string;
|
|
12
|
+
}, assetsTagStr?: string): Promise<void>;
|
|
13
|
+
export declare function buildRootEsmContent(tempRootFilePath: string): Promise<{
|
|
14
|
+
component: RootJsxContent;
|
|
15
|
+
staticData: GlobalStaticData;
|
|
16
|
+
}>;
|
|
17
|
+
export declare function buildGlobalStaticData(getGlobalStaticData: GetGlobalStaticData): Promise<GlobalStaticData>;
|
|
18
|
+
export declare function buildStaticPage(entryPoint: string, outFile: string, rootStaticContent: RootStaticContent, assetsTagStr?: string): Promise<void>;
|
|
19
|
+
export declare function buildStaticData(getStaticData: GetStaticData): Promise<StaticData>;
|
|
20
|
+
export declare function buildHtmlPage(pageJsxContent: PageJsxContent, staticDataItem: StaticDataItem, routePath: string, rootStaticContent: RootStaticContent, assetsTagStr?: string, frontmatter?: {}): Promise<void>;
|
|
21
|
+
export declare function buildTempAssets(viteConfig: InlineConfig, buildOptions: {
|
|
22
|
+
fileName: string;
|
|
23
|
+
outdir: string;
|
|
24
|
+
assetDir: string;
|
|
25
|
+
}): Promise<void>;
|
|
26
|
+
export declare function buildAssetsTagStr(entryPoints: string[], buildOptions: {
|
|
27
|
+
outbase: string;
|
|
28
|
+
outdir: string;
|
|
29
|
+
}): Promise<string>;
|
|
30
|
+
export declare function buildCopyDir(targetDir: string, outDir: string, log?: "public" | "assets"): Promise<void>;
|
package/dist/build.js
ADDED
|
@@ -0,0 +1,239 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
import React from "react";
|
|
21
|
+
import fs from "fs-extra";
|
|
22
|
+
import path from "path";
|
|
23
|
+
import url from "url";
|
|
24
|
+
import pc from "picocolors";
|
|
25
|
+
import { Fragment } from "react";
|
|
26
|
+
import { build as esBuild } from "esbuild";
|
|
27
|
+
import mdx from "@mdx-js/esbuild";
|
|
28
|
+
import { build as viteBuild, mergeConfig } from "vite";
|
|
29
|
+
import { resolvePlugin } from "./esbuild.js";
|
|
30
|
+
import { renderHtml } from "./render.js";
|
|
31
|
+
const __filename = url.fileURLToPath(import.meta.url);
|
|
32
|
+
const __dirname = path.dirname(__filename);
|
|
33
|
+
async function buildTempPages(entryPoints, buildOptions) {
|
|
34
|
+
const ministaPkgURL = new URL(path.resolve(__dirname + "/../package.json"), import.meta.url);
|
|
35
|
+
const ministaPkg = JSON.parse(fs.readFileSync(ministaPkgURL, "utf8"));
|
|
36
|
+
const userPkgURL = new URL(path.resolve("package.json"), import.meta.url);
|
|
37
|
+
const userPkg = JSON.parse(fs.readFileSync(userPkgURL, "utf8"));
|
|
38
|
+
const esbuildExternal = [
|
|
39
|
+
...Object.keys(ministaPkg.dependencies || {}),
|
|
40
|
+
...Object.keys(ministaPkg.devDependencies || {}),
|
|
41
|
+
...Object.keys(ministaPkg.peerDependencies || {}),
|
|
42
|
+
...Object.keys(userPkg.dependencies || {}),
|
|
43
|
+
...Object.keys(userPkg.devDependencies || {}),
|
|
44
|
+
...Object.keys(userPkg.peerDependencies || {}),
|
|
45
|
+
"*.css",
|
|
46
|
+
"*.scss",
|
|
47
|
+
"*.sass"
|
|
48
|
+
];
|
|
49
|
+
await esBuild({
|
|
50
|
+
entryPoints,
|
|
51
|
+
outbase: buildOptions.outbase,
|
|
52
|
+
outdir: buildOptions.outdir,
|
|
53
|
+
outExtension: { ".js": ".mjs" },
|
|
54
|
+
bundle: true,
|
|
55
|
+
format: "esm",
|
|
56
|
+
platform: "node",
|
|
57
|
+
inject: [
|
|
58
|
+
path.resolve(__dirname + "/../lib/shim-react.js"),
|
|
59
|
+
path.resolve(__dirname + "/../lib/shim-fetch.js")
|
|
60
|
+
],
|
|
61
|
+
external: esbuildExternal,
|
|
62
|
+
plugins: [
|
|
63
|
+
mdx(buildOptions.mdxConfig),
|
|
64
|
+
resolvePlugin({
|
|
65
|
+
"react/jsx-runtime": "react/jsx-runtime.js"
|
|
66
|
+
})
|
|
67
|
+
]
|
|
68
|
+
}).catch(() => process.exit(1));
|
|
69
|
+
}
|
|
70
|
+
async function buildStaticPages(entryPoints, tempRootFilePath, buildOptions, assetsTagStr) {
|
|
71
|
+
const rootStaticContent = await buildRootEsmContent(tempRootFilePath);
|
|
72
|
+
await Promise.all(entryPoints.map(async (entryPoint) => {
|
|
73
|
+
const extname = path.extname(entryPoint);
|
|
74
|
+
const basename = path.basename(entryPoint, extname);
|
|
75
|
+
const dirname = path.dirname(entryPoint).replace(buildOptions.outbase, buildOptions.outdir);
|
|
76
|
+
const filename = path.join(dirname, basename + ".html");
|
|
77
|
+
await buildStaticPage(entryPoint, filename, rootStaticContent, assetsTagStr);
|
|
78
|
+
}));
|
|
79
|
+
}
|
|
80
|
+
async function buildRootEsmContent(tempRootFilePath) {
|
|
81
|
+
const defaultRootEsmContent = {
|
|
82
|
+
component: Fragment,
|
|
83
|
+
staticData: { props: {} }
|
|
84
|
+
};
|
|
85
|
+
if (!tempRootFilePath) {
|
|
86
|
+
return defaultRootEsmContent;
|
|
87
|
+
} else {
|
|
88
|
+
const rootEsmContent = await import(tempRootFilePath);
|
|
89
|
+
const rootJsxContent = rootEsmContent.default ? rootEsmContent.default : Fragment;
|
|
90
|
+
const staticData = rootEsmContent.getStaticData ? await buildGlobalStaticData(rootEsmContent.getStaticData) : { props: {} };
|
|
91
|
+
return { component: rootJsxContent, staticData };
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
async function buildGlobalStaticData(getGlobalStaticData) {
|
|
95
|
+
const response = await getGlobalStaticData();
|
|
96
|
+
return response;
|
|
97
|
+
}
|
|
98
|
+
async function buildStaticPage(entryPoint, outFile, rootStaticContent, assetsTagStr) {
|
|
99
|
+
const pageEsmContent = await import(path.resolve(entryPoint));
|
|
100
|
+
const pageJsxContent = pageEsmContent.default;
|
|
101
|
+
const frontmatter = pageEsmContent.frontmatter ? pageEsmContent.frontmatter : void 0;
|
|
102
|
+
const defaultStaticDataItem = { props: {}, paths: {} };
|
|
103
|
+
const staticData = pageEsmContent.getStaticData ? await buildStaticData(pageEsmContent.getStaticData) : void 0;
|
|
104
|
+
if (!staticData) {
|
|
105
|
+
const staticDataItem = defaultStaticDataItem;
|
|
106
|
+
return await buildHtmlPage(pageJsxContent, staticDataItem, outFile, rootStaticContent, assetsTagStr, frontmatter);
|
|
107
|
+
}
|
|
108
|
+
if ("props" in staticData && "paths" in staticData === false) {
|
|
109
|
+
const staticDataItem = __spreadValues(__spreadValues({}, defaultStaticDataItem), staticData);
|
|
110
|
+
return await buildHtmlPage(pageJsxContent, staticDataItem, outFile, rootStaticContent, assetsTagStr, frontmatter);
|
|
111
|
+
}
|
|
112
|
+
if ("paths" in staticData) {
|
|
113
|
+
const staticDataItem = __spreadValues(__spreadValues({}, defaultStaticDataItem), staticData);
|
|
114
|
+
let fixedOutfile = outFile;
|
|
115
|
+
for await (const [key, value] of Object.entries(staticDataItem.paths)) {
|
|
116
|
+
const reg = new RegExp("\\[" + key + "\\]", "g");
|
|
117
|
+
fixedOutfile = fixedOutfile.replace(reg, `${value}`);
|
|
118
|
+
}
|
|
119
|
+
return await buildHtmlPage(pageJsxContent, staticDataItem, fixedOutfile, rootStaticContent, assetsTagStr, frontmatter);
|
|
120
|
+
}
|
|
121
|
+
if (Array.isArray(staticData) && staticData.length > 0) {
|
|
122
|
+
const entryPoints = staticData;
|
|
123
|
+
await Promise.all(entryPoints.map(async (entryPoint2) => {
|
|
124
|
+
const staticDataItem = __spreadValues(__spreadValues({}, defaultStaticDataItem), entryPoint2);
|
|
125
|
+
let fixedOutfile = outFile;
|
|
126
|
+
for await (const [key, value] of Object.entries(staticDataItem.paths)) {
|
|
127
|
+
const reg = new RegExp("\\[" + key + "\\]", "g");
|
|
128
|
+
fixedOutfile = fixedOutfile.replace(reg, `${value}`);
|
|
129
|
+
}
|
|
130
|
+
return await buildHtmlPage(pageJsxContent, staticDataItem, fixedOutfile, rootStaticContent, assetsTagStr, frontmatter);
|
|
131
|
+
}));
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
async function buildStaticData(getStaticData) {
|
|
135
|
+
const response = await getStaticData();
|
|
136
|
+
return response;
|
|
137
|
+
}
|
|
138
|
+
async function buildHtmlPage(pageJsxContent, staticDataItem, routePath, rootStaticContent, assetsTagStr, frontmatter) {
|
|
139
|
+
const RootComponent = rootStaticContent.component;
|
|
140
|
+
const globalStaticData = rootStaticContent.staticData;
|
|
141
|
+
const PageComponent = pageJsxContent;
|
|
142
|
+
const staticProps = staticDataItem.props;
|
|
143
|
+
const RenderComponent = () => {
|
|
144
|
+
if (RootComponent === Fragment) {
|
|
145
|
+
return /* @__PURE__ */ React.createElement(Fragment, null, (() => {
|
|
146
|
+
if (PageComponent === Fragment) {
|
|
147
|
+
return /* @__PURE__ */ React.createElement(Fragment, null);
|
|
148
|
+
} else {
|
|
149
|
+
return /* @__PURE__ */ React.createElement(PageComponent, __spreadProps(__spreadValues(__spreadValues({}, globalStaticData == null ? void 0 : globalStaticData.props), staticProps), {
|
|
150
|
+
frontmatter: RootComponent !== Fragment && frontmatter
|
|
151
|
+
}));
|
|
152
|
+
}
|
|
153
|
+
})());
|
|
154
|
+
} else {
|
|
155
|
+
return /* @__PURE__ */ React.createElement(RootComponent, __spreadProps(__spreadValues(__spreadValues({}, globalStaticData == null ? void 0 : globalStaticData.props), staticProps), {
|
|
156
|
+
frontmatter: RootComponent !== Fragment && frontmatter
|
|
157
|
+
}), (() => {
|
|
158
|
+
if (PageComponent === Fragment) {
|
|
159
|
+
return /* @__PURE__ */ React.createElement(Fragment, null);
|
|
160
|
+
} else {
|
|
161
|
+
return /* @__PURE__ */ React.createElement(PageComponent, __spreadProps(__spreadValues(__spreadValues({}, globalStaticData == null ? void 0 : globalStaticData.props), staticProps), {
|
|
162
|
+
frontmatter: RootComponent !== Fragment && frontmatter
|
|
163
|
+
}));
|
|
164
|
+
}
|
|
165
|
+
})());
|
|
166
|
+
}
|
|
167
|
+
};
|
|
168
|
+
const html = await renderHtml(/* @__PURE__ */ React.createElement(RenderComponent, null), assetsTagStr);
|
|
169
|
+
await fs.outputFile(routePath, html).then(() => {
|
|
170
|
+
console.log(`${pc.bold(pc.green("BUILD"))} ${pc.bold(routePath)}`);
|
|
171
|
+
}).catch((err) => {
|
|
172
|
+
console.error(err);
|
|
173
|
+
});
|
|
174
|
+
}
|
|
175
|
+
async function buildTempAssets(viteConfig, buildOptions) {
|
|
176
|
+
const customConfig = {
|
|
177
|
+
build: {
|
|
178
|
+
write: false,
|
|
179
|
+
rollupOptions: {
|
|
180
|
+
input: {
|
|
181
|
+
__minista_auto_bundle_asset_pages: path.resolve(__dirname + "/../dist/pages.js")
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
};
|
|
186
|
+
const mergedConfig = mergeConfig(viteConfig, customConfig);
|
|
187
|
+
const result = await viteBuild(mergedConfig);
|
|
188
|
+
const items = result.output;
|
|
189
|
+
if (Array.isArray(items) && items.length > 0) {
|
|
190
|
+
items.map((item) => {
|
|
191
|
+
if (item.fileName.match(/__minista_auto_bundle_asset_pages\.css/)) {
|
|
192
|
+
const customFileName = `${buildOptions.outdir}/${buildOptions.fileName}.css`;
|
|
193
|
+
return (item == null ? void 0 : item.source) && fs.outputFile(customFileName, item == null ? void 0 : item.source);
|
|
194
|
+
} else if (item.fileName.match(/__minista_auto_bundle_asset_pages\.js/)) {
|
|
195
|
+
return;
|
|
196
|
+
} else {
|
|
197
|
+
const customFileName = buildOptions.outdir + item.fileName.replace(buildOptions.assetDir, "");
|
|
198
|
+
const customCode = (item == null ? void 0 : item.source) ? item == null ? void 0 : item.source : (item == null ? void 0 : item.code) ? item == null ? void 0 : item.code : "";
|
|
199
|
+
return customCode && fs.outputFile(customFileName, customCode);
|
|
200
|
+
}
|
|
201
|
+
});
|
|
202
|
+
}
|
|
203
|
+
}
|
|
204
|
+
async function buildAssetsTagStr(entryPoints, buildOptions) {
|
|
205
|
+
const assetsTags = entryPoints.map((entryPoint) => {
|
|
206
|
+
const assetPath = entryPoint.replace(buildOptions.outbase, buildOptions.outdir);
|
|
207
|
+
if (assetPath.endsWith(".css")) {
|
|
208
|
+
return `<link rel="stylesheet" href="/${assetPath}">`;
|
|
209
|
+
} else if (assetPath.endsWith(".js")) {
|
|
210
|
+
return `<script defer src="/${assetPath}"><\/script>`;
|
|
211
|
+
}
|
|
212
|
+
});
|
|
213
|
+
const assetsTagStr = assetsTags.join("");
|
|
214
|
+
return assetsTagStr;
|
|
215
|
+
}
|
|
216
|
+
async function buildCopyDir(targetDir, outDir, log) {
|
|
217
|
+
return fs.copy(targetDir, outDir).then(() => {
|
|
218
|
+
if (log === "public") {
|
|
219
|
+
console.log(`${pc.bold(pc.green("BUILD"))} ${pc.bold(targetDir + "/**/* -> " + outDir)}`);
|
|
220
|
+
}
|
|
221
|
+
if (log === "assets") {
|
|
222
|
+
console.log(`${pc.bold(pc.green("BUILD"))} ${pc.bold(outDir)}`);
|
|
223
|
+
}
|
|
224
|
+
}).catch((err) => {
|
|
225
|
+
console.error(err);
|
|
226
|
+
});
|
|
227
|
+
}
|
|
228
|
+
export {
|
|
229
|
+
buildAssetsTagStr,
|
|
230
|
+
buildCopyDir,
|
|
231
|
+
buildGlobalStaticData,
|
|
232
|
+
buildHtmlPage,
|
|
233
|
+
buildRootEsmContent,
|
|
234
|
+
buildStaticData,
|
|
235
|
+
buildStaticPage,
|
|
236
|
+
buildStaticPages,
|
|
237
|
+
buildTempAssets,
|
|
238
|
+
buildTempPages
|
|
239
|
+
};
|