Skip to content

Commit 366949a

Browse files
baiwusanyu-cbaiwusanyu-c
committed
chore: temp commit
1 parent 1dffa38 commit 366949a

File tree

7 files changed

+82
-72
lines changed

7 files changed

+82
-72
lines changed

‎packages/core/hmr/hmr.ts‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ export function webpackHMR(
2525
if (sfcModulesPathList && sfcModulesPathList.sfcPath) {
2626
const ls = setTArray(sfcModulesPathList.sfcPath)
2727
ls.forEach(() => {
28-
// updatedCSSModules
28+
// updated CSSModules
2929
updatedCSSModules(CSSFileModuleMap, userOptions, file)
3030
})
3131
}
@@ -43,7 +43,11 @@ export function updatedCSSModules(
4343
userOptions: Options,
4444
file: string) {
4545
const updatedCSSMS = preProcessCSS(userOptions, userOptions.alias, [file]).get(file)
46-
CSSFileModuleMap.set(file, updatedCSSMS!)
46+
const res = {
47+
...updatedCSSMS,
48+
sfcPath: CSSFileModuleMap.get(file).sfcPath,
49+
}
50+
CSSFileModuleMap.set(file, res!)
4751
}
4852

4953
/**

‎packages/core/index.ts‎

Lines changed: 41 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@ import { createUnplugin } from 'unplugin'
22
import {
33
JSX_TSX_REG, NAME,
44
SUPPORT_FILE_REG,
5+
log,
6+
runAsyncTaskList,
57
setTArray,
68
transformSymbol,
79
} from '@unplugin-vue-cssvars/utils'
@@ -97,9 +99,7 @@ const unplugin = createUnplugin<Options>(
9799
if (res)
98100
mgcStr = res
99101
}
100-
// console.log('###### pre transId#######\n', id)
101-
// console.log('###### pre mgcStr#######\n', mgcStr.toString())
102-
// console.log(vbindVariableList)
102+
103103
return {
104104
code: mgcStr.toString(),
105105
get map() {
@@ -113,9 +113,6 @@ const unplugin = createUnplugin<Options>(
113113
} catch (err: unknown) {
114114
this.error(`[${NAME}] ${err}`)
115115
}
116-
117-
console.log('################## pev', id)
118-
console.log(mgcStr.toString())
119116
},
120117
vite: {
121118
// Vite plugin
@@ -139,73 +136,63 @@ const unplugin = createUnplugin<Options>(
139136
},
140137
webpack(compiler) {
141138
// mark webpack hmr
142-
let file = ''
139+
let modifiedFile = ''
143140
compiler.hooks.watchRun.tap(NAME, (compilation1) => {
144-
console.log('watchRun')
145141
if (compilation1.modifiedFiles) {
146-
file = transformSymbol(setTArray(compilation1.modifiedFiles)[0] as string)
147-
if (SUPPORT_FILE_REG.test(file)) {
142+
modifiedFile = transformSymbol(setTArray(compilation1.modifiedFiles)[0] as string)
143+
if (SUPPORT_FILE_REG.test(modifiedFile)) {
148144
isHMR = true
149145
webpackHMR(
150146
CSSFileModuleMap,
151147
userOptions,
152-
file,
148+
modifiedFile,
153149
)
154150
}
155151
}
156152
})
157153

158154
compiler.hooks.compilation.tap(NAME, (compilation) => {
159-
160-
compilation.hooks.finishModules.tapAsync(NAME, (modules, callback) => {
161-
// cache module
162-
for (const value of modules) {
163-
console.log('##### finishModules', modules.size)
164-
const resource = transformSymbol(value.resource)
165-
// 只有 script（两个） 只更新 style
166-
//只有 第二个 script 更新 style 和 sfc， 但 sfc 会延后一次
167-
//只有 第一个 script 只更新 style
168-
if (resource.includes('?vue&type=script')) {
169-
const transId = 'D:/project-github/unplugin-vue-cssvars/play/webpack/src/App.vue'
170-
if (vbindVariableList.get(transId)) {
171-
let ca = cacheWebpackModule.get(transId)
172-
ca = new Set()
173-
ca.add(value)
174-
cacheWebpackModule.set(transId, ca)
155+
compilation.hooks.finishModules.tapAsync(NAME, async(modules, callback) => {
156+
if (isHMR) {
157+
const needRebuildModules = new Map<string, any>()
158+
for (const value of modules) {
159+
const resource = transformSymbol(value.resource)
160+
if (resource.includes('?vue&type=script')) {
161+
const sfcPathKey = resource.split('?vue')[0]
162+
if (CSSFileModuleMap.get(modifiedFile).sfcPath.has(sfcPathKey))
163+
needRebuildModules.set(sfcPathKey, value)
175164
}
176165
}
177-
}
178-
179-
if (isHMR) {
180-
const keyPath = 'D:/project-github/unplugin-vue-cssvars/play/webpack/src/App.vue'
181-
const cwm = cacheWebpackModule.get(keyPath)
182-
console.log('############### cwm', cwm.size)
183-
//for (const mv of cwm) {
184-
compilation.rebuildModule([...cwm][0], (e) => {
185-
console.log('hot updated')
186-
callback()
187-
if (e) {
188-
console.log(e)
189-
}
166+
if (needRebuildModules.size > 0) {
167+
const promises = []
168+
for (const [key] of needRebuildModules) {
169+
// 创建一个 Promise 对象，表示异步操作
170+
const promise = new Promise((resolve, reject) => {
171+
compilation.rebuildModule(needRebuildModules.get(key), (e) => {
172+
if (e)
173+
reject(e)
174+
else
175+
resolve()
190176
})
191-
// }
192-
}else{
177+
})
178+
promises.push(promise)
179+
}
180+
Promise.all(promises)
181+
.then(() => {
182+
callback()
183+
})
184+
.catch((e) => {
185+
log('error', e)
186+
})
187+
callback()
188+
} else {
193189
callback()
194190
}
191+
} else {
192+
callback()
193+
}
195194
})
196-
197195
})
198-
/**
199-
* 现在问题是 通过watchRun在finishModuled的钩子里，
200-
* 我 rebuildModule另一个模块，但 无法完成整个周期（我觉得 rebuildModule 后应该再次进入finishModuled），
201-
* 实现热更新，只能在下次watchRun 时结束，这导致我第一层热更新失效，第二次热更新结果是第一次的
202-
*/
203-
/* compiler.hooks.compilation.tap(NAME, (compilation) => {
204-
compilation.hooks.afterOptimizeChunkAssets.tap(NAME, (chunks) => {
205-
206-
});
207-
});
208-
*/
209196
},
210197
},
211198

@@ -267,8 +254,6 @@ const unplugin = createUnplugin<Options>(
267254
}
268255
}
269256

270-
console.log('################## post', id)
271-
// console.log(mgcStr.toString())
272257
return {
273258
code: mgcStr.toString(),
274259
get map() {

‎play/webpack/src/App.vue‎

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,17 @@
11
<script setup lang="ts">
22
import { ref } from 'vue'
3-
console.log(111111)
3+
import Comp from '@/comp.vue'
4+
import Comp2 from '@/comp2.vue'
45
const color = ref('red')
56
const appAsd = () => 'green'
67
const fooColor = appAsd()
7-
const msg = ref('cc')
8+
const msg = ref('aa')
89
</script>
910

1011
<template>
1112
<div id="foo" class="scss">
1213
{{ msg }} a
14+
<Comp />
15+
<Comp2 />
1316
</div>
1417
</template>
15-
16-
<style scoped>
17-
@import "../src/assets/css/foo.css";
18-
/*#foo{
19-
background: v-bind(fooColor);
20-
width: 300px;
21-
}*/
22-
</style>

‎play/webpack/src/assets/css/foo.css‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
#foo{
2-
color: v-bind-m(awdw);
1+
p{
2+
color: v-bind-m(color);
33
width: 200px;
44
height: 30px;
5-
}
6-
/*--7c06d03e, --7c06d03e:undefined;*/
5+
}

‎utils/async-task.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
export function runAsyncTaskList(
2+
taskNum: number,
3+
taskFunc: (index: number) => Promise<Record<any, any> | void>) {
4+
const taskList = [] as Array<Promise<any>>
5+
for (let i = 0; i < taskNum; i++) {
6+
taskList.push(new Promise((resolve) => {
7+
resolve(taskFunc(i))
8+
}))
9+
}
10+
return taskList
11+
}

‎utils/index.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
import { join, parse } from 'path'
22
import { SUPPORT_FILE, SUPPORT_FILE_REG } from './constant'
33
export * from './constant'
4+
export * from './log'
5+
export * from './async-task'
46

57
export const extend = <
68
T extends Record<string, any>,

‎utils/log.ts‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import chalk from 'chalk'
2+
3+
export declare type TLog = 'error' | 'warning' | 'info' | 'success'
4+
5+
export const logType = {
6+
info: (msg: string, prefix = '') => chalk.blueBright.bold(`${prefix}${msg}`),
7+
error: (msg: string, prefix = '') => chalk.redBright.bold(`${prefix}${msg}`),
8+
warning: (msg: string, prefix = '') => chalk.yellowBright.bold(`${prefix}${msg}`),
9+
success: (msg: string, prefix = '') => chalk.greenBright.bold(`${prefix}${msg}`),
10+
}
11+
12+
export const log = (type: TLog, msg: string, prefix = '[unplugin-vue-cssvars]:') => {
13+
console.log(logType[type](msg, prefix))
14+
}

0 commit comments

Comments
 (0)