Skip to content

Commit aa63c7e

Browse files
1aron1aron
committed
Add(Vite): extract mode
1 parent 977ca16 commit aa63c7e

File tree

22 files changed

+152
-159
lines changed

22 files changed

+152
-159
lines changed

‎examples/vite/src/main.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
// import '.virtual/master.css'
21
import './style.css'
32
import { setupCounter } from './counter'
43

‎examples/vite/vite.config.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,6 @@ import masterCSS from '@master/css.vite'
33

44
export default defineConfig({
55
plugins: [
6-
masterCSS()
6+
masterCSS({ mode: 'extract' })
77
]
88
})

‎packages/builder/src/core.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,11 @@ export default class CSSBuilder extends EventEmitter {
3737
if (this.initialized) return
3838
if (typeof customOptions === 'string') {
3939
this.options = extend(defaultOptions, exploreConfig(customOptions, {
40-
found: (basename) => log.i`Loaded **${basename}**`,
40+
found: (basename) => {
41+
if (this.options.verbose && this.options.verbose > 1) {
42+
log.i`**${basename}** found`
43+
}
44+
},
4145
cwd: this.cwd
4246
}), customOptions)
4347
} else {

‎packages/explore-config/src/index.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import type { Config } from '@master/css'
44

55
export default function exploreConfig(options?: ExploreConfigOptions & { name?: string }) {
66
return _exploreConfig(options?.name || 'master.css', {
7-
found: (basename) => process.env.NODE_ENV !== 'test' && log.i`Loaded **${basename}**`,
7+
found: (basename) => process.env.DEBUG && log.i`Loaded **${basename}**`,
88
...options
99
}) as Config | undefined
1010
}

‎packages/vite/src/common.ts‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,10 @@ export const ENTRY_MODULE_PATTERNS = [
33
'src/index.{js,ts,jsx,tsx,mjs,cjs}',
44
'src/app.{js,ts,jsx,tsx,mjs,cjs}',
55
'index.{js,ts,jsx,tsx,mjs,cjs}',
6-
]
6+
]
7+
8+
export enum Modes {
9+
runtime = 'Runtime Rendering',
10+
extract = 'Static Extraction',
11+
progressive = 'Progressive Hydration'
12+
}

‎packages/vite/src/core.ts‎

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,23 @@ import type { Pattern } from 'fast-glob'
44
import fg from 'fast-glob'
55
import ExtractMode from './modes/extract'
66
import RuntimeMode from './modes/runtime'
7-
import { ENTRY_MODULE_PATTERNS } from './common'
7+
import { ENTRY_MODULE_PATTERNS, Modes } from './common'
8+
import log from '@techor/log'
9+
import path from 'path'
10+
import { readFileSync } from 'fs'
11+
import { fileURLToPath } from 'url'
12+
13+
const __filename = fileURLToPath(import.meta.url)
14+
const __dirname = path.dirname(__filename)
15+
16+
const pkg = JSON.parse(
17+
readFileSync(path.join(__dirname, '../package.json'), 'utf-8')
18+
)
19+
const version = 'v' + (pkg.version || '0.0.0')
820

921
export interface PluginOptions {
22+
mode: keyof typeof Modes
1023
builder?: ExtractorOptions | Pattern
11-
mode?: 'extract' | 'runtime'
1224
config?: string
1325
}
1426

@@ -41,6 +53,14 @@ export default function masterCSSPlugin(options = defaultOptions): Plugin[] {
4153
])
4254
context.configId = configFiles[0]
4355
context.entryId = entryFiles[0]
56+
const relConfigId = context.configId ? path.relative(config.root, context.configId) : ''
57+
const relEntryId = context.entryId ? path.relative(config.root, context.entryId) : ''
58+
if (config.env.DEV) {
59+
log` ${log.chalk.bold.yellow('Master CSS')} ${log.chalk.yellow(version)} ${Modes[options.mode]}`
60+
log``
61+
log` · Entry: ${relEntryId ? relEntryId : 'none'}`
62+
log` · Config: ${relConfigId ? relConfigId : 'none'}`
63+
}
4464
},
4565
} as Plugin
4666
}

‎packages/vite/src/index.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1-
export { default } from './core'
1+
export { default } from './core'
2+
export * from './common'

‎packages/vite/src/modes/extract.ts‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,36 @@
11
import { PluginContext, PluginOptions } from '../core'
2-
import type { Plugin } from 'vite'
3-
import CSSBuilder, { Options as ExtractorOptions } from '@master/css-builder'
2+
import { type Plugin } from 'vite'
3+
import CSSBuilder, { Options } from '@master/css-builder'
44
import VirtualCSSModulePlugin from '../plugins/virtual-css-module'
55
import VirtualCSSHMRPlugin from '../plugins/virtual-css-hmr'
6+
import InjectVirtualCSSImportPlugin from '../plugins/inject-virtual-css-init'
67

78
export default function ExtractMode(options: PluginOptions, context: PluginContext): Plugin[] {
8-
const builder = new CSSBuilder(options.builder)
9-
builder.on('init', (opt: ExtractorOptions) => {
10-
opt.include = []
11-
})
9+
const builder: CSSBuilder = new CSSBuilder(options.builder)
1210
return [
1311
{
1412
name: 'master-css:static',
1513
enforce: 'pre',
1614
apply(_, env) {
17-
if (!env.isSsrBuild) {
18-
builder.init()
19-
return true
20-
} else {
21-
return false
22-
}
15+
return !env.isSsrBuild
2316
},
2417
async buildStart() {
18+
builder.init()
19+
builder.options.verbose = 0
20+
builder.options.include = []
2521
await builder.prepare()
2622
},
2723
async transform(code, id) {
2824
const resolvedVirtualModuleId = builder.resolvedVirtualModuleId
2925
if (id !== resolvedVirtualModuleId && !id.endsWith('.css')) {
3026
await builder.insert(id, code)
3127
}
28+
},
29+
async configureServer(server) {
30+
await server.waitForRequestsIdle()
3231
}
3332
},
33+
InjectVirtualCSSImportPlugin(options, context, builder),
3434
VirtualCSSHMRPlugin(builder),
3535
VirtualCSSModulePlugin(builder),
3636
]

‎packages/vite/src/modes/runtime.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import type { Plugin } from 'vite'
2-
import InjectCSSRuntimePlugin from '../plugins/inject-runtime'
2+
import InjectCSSRuntimeInitPlugin from '../plugins/inject-runtime-init'
33
import AvoidFOUCPlugin from '../plugins/avoid-fouc'
44
import { PluginContext, PluginOptions } from '../core'
55

66
export default function RuntimeMode(options: PluginOptions, context: PluginContext): Plugin[] {
77
return [
8-
InjectCSSRuntimePlugin(options, context),
8+
InjectCSSRuntimeInitPlugin(options, context),
99
AvoidFOUCPlugin(options, context)
1010
]
1111
}

packages/vite/src/plugins/inject-runtime.ts renamed to packages/vite/src/plugins/inject-runtime-init.ts

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,17 @@ import MagicString from 'magic-string'
33
import path from 'path'
44
import { PluginContext, PluginOptions } from '../core'
55

6-
const __MASTER_CSS_RUNTIME_INJECTED__ = '/*__MASTER_CSS_RUNTIME_INJECTED__*/'
6+
const __MASTER_CSS_RUNTIME_INIT_INJECTED__ = '/*__MASTER_CSS_RUNTIME_INIT_INJECTED__*/'
77

8-
export default function InjectCSSRuntimePlugin(options: PluginOptions = {}, context: PluginContext): Plugin {
8+
export default function InjectCSSRuntimeInitPlugin(options: PluginOptions, context: PluginContext): Plugin {
99
return {
10-
name: 'master-css:inject-runtime',
10+
name: 'master-css:inject-runtime-init',
1111
enforce: 'pre',
1212
transform(code, id) {
13-
if (context.entryId !== id || code.includes(__MASTER_CSS_RUNTIME_INJECTED__)) return
13+
if (context.entryId !== id || code.includes(__MASTER_CSS_RUNTIME_INIT_INJECTED__)) return
1414
const s = new MagicString(code)
1515
const imports = [
16-
__MASTER_CSS_RUNTIME_INJECTED__,
16+
__MASTER_CSS_RUNTIME_INIT_INJECTED__,
1717
`import { initCSSRuntime } from '@master/css-runtime'`,
1818
]
1919
if (context.configId) {
@@ -23,9 +23,7 @@ export default function InjectCSSRuntimePlugin(options: PluginOptions = {}, cont
2323
} else {
2424
imports.push(`initCSSRuntime()`)
2525
}
26-
2726
s.prepend(imports.join('\n') + '\n')
28-
2927
return {
3028
code: s.toString(),
3129
map: s.generateMap({ hires: true }),

0 commit comments

Comments
 (0)