-
-
Notifications
You must be signed in to change notification settings - Fork 24
/
vite.runtime.config.js
97 lines (87 loc) · 2.5 KB
/
vite.runtime.config.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
import {parseTwee, Passage} from 'extwee';
import {readdir, readFile} from 'fs/promises';
import {extname, resolve} from 'path';
import postcssUrl from 'postcss-url';
import {visualizer} from 'rollup-plugin-visualizer';
import serveStatic from 'serve-static';
import {defineConfig} from 'vite';
import checker from 'vite-plugin-checker';
import {createHtmlPlugin} from 'vite-plugin-html';
import {viteSingleFile} from 'vite-plugin-singlefile';
const isRelease = process.env.NODE_ENV === 'production';
/**
* Assembles all Twee files under demo/ into a single story.
*/
async function demoStoryData() {
let source = '';
for (const filename of await readdir(resolve(__dirname, 'demo'))) {
if (
extname(filename) !== '.twee' ||
filename === 'cloak-of-darkness.twee'
) {
// Skip Cloak of Darkness and related assets.
continue;
}
source +=
(await readFile(resolve(__dirname, 'demo', filename), 'utf8')) + '\n';
}
const story = parseTwee(source);
story.name = 'Demo';
story.start = 'Start';
// These passages will be removed by extwee and set as custom script/stylesheet.
story.addPassage(
new Passage('Custom Style', '.custom-style { color: red }', ['stylesheet'])
);
story.addPassage(
new Passage('Custom Script', 'window.customScriptLoaded = true', ['script'])
);
return story.toTwine2HTML();
}
/**
* Serves files under demo/assets/ at /. This is used for examples that
* reference external assets like sounds.
*/
const demoAssetPlugin = {
name: 'chapbook-serve-demo-assets',
configureServer(server) {
server.middlewares.use(serveStatic('demo/assets/'));
}
};
export default defineConfig(async () => ({
build: {
emptyOutDir: true,
outDir: '../../build/'
},
css: {
postcss: {
// Inline SVGs as data URIs.
plugins: [postcssUrl({optimizeSvgEncode: true, url: 'inline'})]
}
},
plugins: [
process.env.NODE_ENV !== 'production' && demoAssetPlugin,
process.env.NODE_ENV !== 'production' &&
checker({
eslint: {lintCommand: 'eslint "./**/*.ts"'},
overlay: {initialIsOpen: false},
typescript: true
}),
createHtmlPlugin({
inject: {
data: {
storyData: isRelease ? '{{STORY_DATA}}' : await demoStoryData()
},
ejsOptions: {
root: 'src/runtime'
}
},
minify: true
}),
process.env.NODE_ENV !== 'production' && visualizer(),
viteSingleFile()
],
root: './src/runtime',
server: {
open: true
}
}));