优化HMR #7
|
@ -408,22 +408,16 @@ function render(_ctx, _cache) {
|
|||
/**
|
||||
* 解析模板html
|
||||
*/
|
||||
export function parseHtml(
|
||||
html,
|
||||
{ page, imports, entry, LEGACY_MODE, session }
|
||||
) {
|
||||
export function parseHtml(html, { page, imports, entry, LEGACY_MODE }) {
|
||||
return html
|
||||
.replace(/\r\n/g, '\n')
|
||||
.replace(
|
||||
'</head>',
|
||||
`${
|
||||
process.env.NODE_ENV === 'development'
|
||||
? ` <script>${Es.transformSync(
|
||||
createHmrScript(LEGACY_MODE, session),
|
||||
{
|
||||
minify: true
|
||||
}
|
||||
).code.trim()}</script>\n`
|
||||
? ` <script>${Es.transformSync(createHmrScript(LEGACY_MODE), {
|
||||
minify: true
|
||||
}).code.trim()}</script>\n`
|
||||
: ''
|
||||
}</head>`
|
||||
)
|
||||
|
|
|
@ -7,7 +7,7 @@ import socket from './ws.js'
|
|||
import chokidar from 'chokidar'
|
||||
import { red } from 'kolorist'
|
||||
|
||||
import { friendlyErrors, defaultCustomElement, md5, gzip } from './utils.js'
|
||||
import { friendlyErrors, defaultCustomElement, gzip } from './utils.js'
|
||||
|
||||
import { compileScss, parseJs, compileVue, parseHtml } from './compile-vue.js'
|
||||
|
||||
|
@ -183,8 +183,7 @@ export default async function createServer(root = '', conf = {}) {
|
|||
page,
|
||||
imports: conf.imports,
|
||||
entry,
|
||||
LEGACY_MODE,
|
||||
session: md5(page.entry)
|
||||
LEGACY_MODE
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
@ -39,7 +39,7 @@ export function friendlyErrors(pathname, ext = '') {
|
|||
export function createHmrScript(legacy, session = '') {
|
||||
return `
|
||||
!(function vue_live_hmr(){
|
||||
var ws = new WebSocket(\`ws\${location.protocol === 'https:' ? 's' : ''}://\${location.host}/ws-fite-hmr?session=${session}\`)
|
||||
var ws = new WebSocket(\`ws\${location.protocol === 'https:' ? 's' : ''}://\${location.host}/ws-fite-hmr?session=\${btoa(location.pathname).replace(/[=\+\/]/g, '')}&lock=\${localStorage.getItem(location.pathname) || 0}\`)
|
||||
|
||||
ws.addEventListener('open', function (r) {
|
||||
if(vue_live_hmr.closed){
|
||||
|
@ -51,6 +51,9 @@ export function createHmrScript(legacy, session = '') {
|
|||
|
||||
ws.addEventListener('close', function(){
|
||||
vue_live_hmr.closed = true
|
||||
if (localStorage.getItem(location.pathname) === '1') {
|
||||
return
|
||||
}
|
||||
setTimeout(vue_live_hmr, 2000)
|
||||
})
|
||||
|
||||
|
|
19
lib/ws.js
19
lib/ws.js
|
@ -15,16 +15,21 @@ class WebSocket {
|
|||
conn.on('connection', (client, req) => {
|
||||
let params = new URLSearchParams(req.url.slice(req.url.indexOf('?')))
|
||||
let session = params.get('session')
|
||||
let lock = +params.get('lock')
|
||||
|
||||
this.#clients.set(session, client)
|
||||
if (lock === 1) {
|
||||
client.close()
|
||||
} else {
|
||||
this.#clients.set(session, client)
|
||||
|
||||
client.once('close', _ => {
|
||||
this.#clients.delete(session)
|
||||
})
|
||||
client.once('close', _ => {
|
||||
this.#clients.delete(session)
|
||||
})
|
||||
|
||||
while (this.#queue.length) {
|
||||
let msg = this.#queue.shift()
|
||||
this.send(msg)
|
||||
while (this.#queue.length) {
|
||||
let msg = this.#queue.shift()
|
||||
this.send(msg)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue