diff --git a/packages/nuxt3/src/builder/builder.ts b/packages/nuxt3/src/builder/builder.ts index 9ca28d4aef..9b0b3d0d0a 100644 --- a/packages/nuxt3/src/builder/builder.ts +++ b/packages/nuxt3/src/builder/builder.ts @@ -1,11 +1,18 @@ -import { join } from 'path' +import { join, relative } from 'path' import fsExtra from 'fs-extra' import consola from 'consola' +import { debounce } from 'lodash' import { BundleBuilder } from 'src/webpack' import { Nuxt } from '../core' -import { compileTemplates, scanTemplates, NuxtTemplate } from './template' +import { + templateData, + compileTemplates, + scanTemplates, + NuxtTemplate +} from './template' import { createWatcher } from './watch' import { resolveApp, NuxtApp } from './app' +import Ignore from './ignore' export class Builder { nuxt: Nuxt @@ -36,26 +43,34 @@ async function build (builder: Builder) { function watch (builder: Builder) { const { nuxt } = builder + const ignore = new Ignore({ + rootDir: nuxt.options.srcDir, + ignoreArray: nuxt.options.ignore.concat( + relative(nuxt.options.rootDir, nuxt.options.buildDir) + ) + }) // Watch internal templates - const nuxtAppWatcher = createWatcher(nuxt.options.appDir) - // nuxtAppWatcher.debug() + const options = nuxt.options.watchers.chokidar + const nuxtAppWatcher = createWatcher(nuxt.options.appDir, options, ignore) nuxtAppWatcher.watchAll(async () => { consola.log('Re-generate templates') await compileTemplates(builder.templates, nuxt.options.buildDir) }) // Watch user app - const appWatcher = createWatcher(builder.app.srcDir, { - ignored: [ - nuxt.options.buildDir - ] - }) - // appWatcher.debug() - appWatcher.watch(/(A|a)pp\.[a-z]{2,3}/, async () => { - await new Promise(resolve => setTimeout(resolve, 200)) - await generate(builder) - }) + const appWatcher = createWatcher(builder.app.srcDir, options, ignore) + // Watch for App.vue creation + // appWatcher.debug('srcDir') + appWatcher.watch( + /^(A|a)pp\.[a-z]{2,3}/, + debounce(({ event }) => { + if (['add', 'unlink'].includes(event)) { + generate(builder) + } + }, 50) + ) + // Watch for page changes appWatcher.watch('pages/', async () => { consola.log('Re-generate routes') await compileTemplates(builder.templates, nuxt.options.buildDir) @@ -69,13 +84,9 @@ export async function generate (builder: Builder) { builder.app = resolveApp(nuxt, nuxt.options.srcDir) const templatesDir = join(builder.nuxt.options.appDir, '_templates') - const appTemplates = await scanTemplates(templatesDir, { - app: builder.app - }) + const appTemplates = await scanTemplates(templatesDir, templateData(builder)) - builder.templates = [ - ...appTemplates - ] + builder.templates = [...appTemplates] await compileTemplates(builder.templates, nuxt.options.buildDir) } diff --git a/packages/nuxt3/src/builder/ignore.ts b/packages/nuxt3/src/builder/ignore.ts index 47cec8715d..223c61e20a 100644 --- a/packages/nuxt3/src/builder/ignore.ts +++ b/packages/nuxt3/src/builder/ignore.ts @@ -67,6 +67,10 @@ export default class Ignore { return paths } + ignores (pathname: string) { + return this.ignore && this.ignore.ignores(pathname) + } + reload () { delete this.ignore delete this.ignoreFile diff --git a/packages/nuxt3/src/builder/template.ts b/packages/nuxt3/src/builder/template.ts index a4f543ec8c..63a911589d 100644 --- a/packages/nuxt3/src/builder/template.ts +++ b/packages/nuxt3/src/builder/template.ts @@ -1,7 +1,6 @@ import { join, relative, dirname } from 'path' import fsExtra from 'fs-extra' import globby from 'globby' -import consola from 'consola' import lodashTemplate from 'lodash/template' export interface NuxtTemplate { @@ -10,11 +9,17 @@ export interface NuxtTemplate { data?: any } +export function templateData (builder) { + return { + app: builder.app + } +} + async function compileTemplate ({ src, path, data }: NuxtTemplate, destDir: string) { const srcContents = await fsExtra.readFile(src, 'utf-8') const compiledSrc = lodashTemplate(srcContents, {})(data) const dest = join(destDir, path) - consola.log('Compile template', dest) + // consola.log('Compile template', dest) await fsExtra.mkdirp(dirname(dest)) await fsExtra.writeFile(dest, compiledSrc) } diff --git a/packages/nuxt3/src/builder/watch.ts b/packages/nuxt3/src/builder/watch.ts index 3751e0d966..c3356369e8 100644 --- a/packages/nuxt3/src/builder/watch.ts +++ b/packages/nuxt3/src/builder/watch.ts @@ -1,20 +1,23 @@ -import { relative } from 'path' import chokidar, { WatchOptions } from 'chokidar' +import defu from 'defu' import consola from 'consola' +import Ignore from './ignore' -export function createWatcher (dir: string, options?: WatchOptions) { - const watcher = chokidar.watch(dir, { +export function createWatcher ( + dir: string, + options?: WatchOptions, + ignore?: Ignore +) { + const opts = defu({ cwd: dir }, options, { ignored: [], - ignoreInitial: true, - ...options + ignoreInitial: true }) - + const watcher = chokidar.watch(dir, opts) const watchAll = (cb: Function, filter?: Function) => { - watcher.on('raw', (event, path: string, _details) => { - if (options.ignored.find(ignore => path.match(ignore))) { - return // 🖕 chokidar ignored option + watcher.on('all', (event, path: string) => { + if (ignore && ignore.ignores(path)) { + return } - path = relative(dir, path) const _event = { event, path } if (!filter || filter(_event)) { cb(_event) @@ -22,7 +25,8 @@ export function createWatcher (dir: string, options?: WatchOptions) { }) } - const watch = (pattern: string| RegExp, cb: Function) => watchAll(cb, e => e.path.match(pattern)) + const watch = (pattern: string | RegExp, cb: Function) => + watchAll(cb, e => e.path.match(pattern)) const debug = (tag: string = '[Watcher]') => { consola.log(tag, 'Watching ', dir) diff --git a/packages/nuxt3/src/config/config/_common.ts b/packages/nuxt3/src/config/config/_common.ts index 1f1bf48d78..806e1e28c7 100644 --- a/packages/nuxt3/src/config/config/_common.ts +++ b/packages/nuxt3/src/config/config/_common.ts @@ -122,7 +122,6 @@ interface CommonConfiguration { styleExtensions: string[] watch: string[] watchers: { - rewatchOnRawEvents?: boolean webpack: WebpackConfiguration['watchOptions'] chokidar: ChokidarWatchOptions } @@ -189,7 +188,7 @@ export default (): CommonConfiguration => ({ // Ignores ignoreOptions: undefined, - ignorePrefix: '-', + ignorePrefix: '_', ignore: [ '**/*.test.*', '**/*.spec.*' @@ -198,7 +197,6 @@ export default (): CommonConfiguration => ({ // Watch watch: [], watchers: { - rewatchOnRawEvents: undefined, webpack: { aggregateTimeout: 1000 },