feat: added FilesChanged plugin

This plugin shows the files which triggered the change

packages/renderer/plugins/FilesChanged.js

@@ -0,0 +1,22 @@
+import path from 'path';
+import chalk from 'chalk';
+import logSymbols from 'log-symbols';
+
+export default class FilesChanged {
+  apply(compiler) {
+    compiler.hooks.watchRun.tap('averjs', compiler => {
+      const { watchFileSystem } = compiler;
+      const watcher = watchFileSystem.watcher || watchFileSystem.wfs.watcher;
+
+      let changedFiles = '';
+      for (const file of Object.keys(watcher.mtimes)) {
+        changedFiles += ` ${chalk.bold.blue(path.basename(file))},`;
+      }
+
+      console.log(
+        logSymbols.info,
+        `Files changed:${changedFiles.slice(0, -1)}`
+      );
+    });
+  }
+}

packages/renderer/src/base.config.js

@@ -8,6 +8,7 @@ import ExtractCssPlugin from 'extract-css-chunks-webpack-plugin';
 import PurgeCssPlugin from 'purgecss-webpack-plugin';
 import StyleLoader from './styleLoader';
 import Webpackbar from 'webpackbar';
+import FilesChanged from '../plugins/FilesChanged';
 import { getAverjsConfig } from '@averjs/config';
 
 export default class WebpackBaseConfiguration {
@@ -41,6 +42,12 @@ export default class WebpackBaseConfiguration {
     this.chainConfig
       .plugin('vue-loader')
         .use(VueLoaderPlugin);
+
+    if (!this.isServer && !this.isProd) {
+      this.chainConfig
+        .plugin('files-changed')
+          .use(FilesChanged);
+    }
 
     this.chainConfig
       .plugin('webpackbar')