2016-10-19 12:41:45 +00:00
|
|
|
import { join } from 'path'
|
2016-10-14 15:05:08 +00:00
|
|
|
import WebpackDevServer from 'webpack-dev-server'
|
2016-10-17 07:05:46 +00:00
|
|
|
import webpack from './build/webpack'
|
2016-10-15 19:49:42 +00:00
|
|
|
import read from './read'
|
2016-10-14 15:05:08 +00:00
|
|
|
|
|
|
|
export default class HotReloader {
|
2016-10-17 07:05:46 +00:00
|
|
|
constructor (dir) {
|
|
|
|
this.dir = dir
|
|
|
|
this.server = null
|
2016-10-19 12:41:45 +00:00
|
|
|
this.stats = null
|
|
|
|
this.compilationErrors = null
|
2016-10-24 07:22:15 +00:00
|
|
|
this.prevAssets = null
|
|
|
|
this.prevEntryChunkNames = null
|
2016-10-17 07:05:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
async start () {
|
|
|
|
await this.prepareServer()
|
2016-10-19 12:41:45 +00:00
|
|
|
this.stats = await this.waitUntilValid()
|
2016-10-17 07:05:46 +00:00
|
|
|
await this.listen()
|
|
|
|
}
|
|
|
|
|
|
|
|
async prepareServer () {
|
|
|
|
const compiler = await webpack(this.dir, { hotReload: true })
|
2016-10-15 19:49:42 +00:00
|
|
|
|
|
|
|
compiler.plugin('after-emit', (compilation, callback) => {
|
|
|
|
const { assets } = compilation
|
2016-10-24 07:22:15 +00:00
|
|
|
|
|
|
|
if (this.prevAssets) {
|
|
|
|
for (const f of Object.keys(assets)) {
|
|
|
|
deleteCache(assets[f].existsAt)
|
|
|
|
}
|
|
|
|
for (const f of Object.keys(this.prevAssets)) {
|
|
|
|
if (!assets[f]) {
|
|
|
|
deleteCache(this.prevAssets[f].existsAt)
|
|
|
|
}
|
2016-10-23 16:42:13 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
this.prevAssets = assets
|
2016-10-24 07:22:15 +00:00
|
|
|
|
2016-10-15 19:49:42 +00:00
|
|
|
callback()
|
|
|
|
})
|
2016-10-14 15:05:08 +00:00
|
|
|
|
2016-10-19 12:41:45 +00:00
|
|
|
compiler.plugin('done', (stats) => {
|
|
|
|
this.stats = stats
|
|
|
|
this.compilationErrors = null
|
2016-10-24 07:22:15 +00:00
|
|
|
|
|
|
|
const entryChunkNames = new Set(stats.compilation.chunks
|
|
|
|
.filter((c) => c.entry)
|
|
|
|
.map((c) => c.name))
|
|
|
|
|
|
|
|
if (this.prevEntryChunkNames) {
|
|
|
|
const added = diff(entryChunkNames, this.prevEntryChunkNames)
|
|
|
|
const removed = diff(this.prevEntryChunkNames, entryChunkNames)
|
|
|
|
|
|
|
|
for (const n of new Set([...added, ...removed])) {
|
|
|
|
const m = n.match(/^bundles\/pages(\/.+?)(?:\/index)?\.js$/)
|
|
|
|
if (!m) {
|
|
|
|
console.error('Unexpected chunk name: ' + n)
|
|
|
|
continue
|
|
|
|
}
|
|
|
|
this.send('reload', m[1])
|
|
|
|
}
|
|
|
|
}
|
|
|
|
this.prevEntryChunkNames = entryChunkNames
|
2016-10-19 12:41:45 +00:00
|
|
|
})
|
|
|
|
|
2016-10-17 07:05:46 +00:00
|
|
|
this.server = new WebpackDevServer(compiler, {
|
|
|
|
publicPath: '/',
|
|
|
|
hot: true,
|
|
|
|
noInfo: true,
|
2016-10-18 09:33:49 +00:00
|
|
|
clientLogLevel: 'warning',
|
|
|
|
stats: {
|
|
|
|
assets: false,
|
|
|
|
children: false,
|
|
|
|
chunks: false,
|
|
|
|
color: false,
|
|
|
|
errors: true,
|
|
|
|
errorDetails: false,
|
|
|
|
hash: false,
|
|
|
|
modules: false,
|
|
|
|
publicPath: false,
|
|
|
|
reasons: false,
|
|
|
|
source: false,
|
|
|
|
timings: false,
|
|
|
|
version: false,
|
|
|
|
warnings: false
|
|
|
|
}
|
2016-10-17 07:05:46 +00:00
|
|
|
})
|
2016-10-14 15:05:08 +00:00
|
|
|
}
|
|
|
|
|
2016-10-19 12:41:45 +00:00
|
|
|
waitUntilValid () {
|
|
|
|
return new Promise((resolve) => {
|
2016-10-14 15:05:08 +00:00
|
|
|
this.server.middleware.waitUntilValid(resolve)
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
listen () {
|
|
|
|
return new Promise((resolve, reject) => {
|
|
|
|
this.server.listen(3030, (err) => {
|
|
|
|
if (err) return reject(err)
|
|
|
|
resolve()
|
|
|
|
})
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
2016-10-19 12:41:45 +00:00
|
|
|
getCompilationErrors () {
|
|
|
|
if (!this.compilationErrors) {
|
|
|
|
this.compilationErrors = new Map()
|
|
|
|
if (this.stats.hasErrors()) {
|
|
|
|
const entries = this.stats.compilation.entries
|
|
|
|
.filter((e) => e.context === this.dir)
|
|
|
|
.filter((e) => !!e.errors.length || !!e.dependenciesErrors.length)
|
|
|
|
|
|
|
|
for (const e of entries) {
|
|
|
|
const path = join(e.context, '.next', e.name)
|
|
|
|
const errors = e.errors.concat(e.dependenciesErrors)
|
|
|
|
this.compilationErrors.set(path, errors)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return this.compilationErrors
|
|
|
|
}
|
|
|
|
|
2016-10-24 07:22:15 +00:00
|
|
|
send (type, data) {
|
|
|
|
this.server.sockWrite(this.server.sockets, type, data)
|
|
|
|
}
|
|
|
|
|
2016-10-14 15:05:08 +00:00
|
|
|
get fileSystem () {
|
|
|
|
return this.server.middleware.fileSystem
|
|
|
|
}
|
|
|
|
}
|
2016-10-19 12:41:45 +00:00
|
|
|
|
|
|
|
function deleteCache (path) {
|
|
|
|
delete require.cache[path]
|
|
|
|
delete read.cache[path]
|
|
|
|
}
|
2016-10-24 07:22:15 +00:00
|
|
|
|
|
|
|
function diff (a, b) {
|
|
|
|
return new Set([...a].filter((v) => !b.has(v)))
|
|
|
|
}
|