首页 > 解决方案 > 如何在 Angular 12 中忽略实时重新加载的目录

问题描述

我的 Angular 应用程序通过 web 服务将文件保存到位于应用程序项目文件夹内的资源目录中。这个存储位置的原因是,我希望这些文件包含在应用程序的 git repo 中。每当我触发保存操作时,资源目录的内容会更改并且应用程序会重新启动,因为 Live Reload 检测到更新......所以我正在寻找一种方法来配置 Live Reload 以忽略此目录。

我找到了更新 webpack.config.js 并在那里指定“要忽略的目录”的提示,但是 Angular 12 不再使用这个文件。我已经安装了允许我使用 extra-webpack.config.js 的必要包,但不知道如何将这些目录规范放在那里。

这是我的额外 webpack.config.js:

module.exports = {
    resolve: {
        fallback: {
            "fs": false,
            "path": require.resolve('path-browserify')
        }
    },
    watchOptions: {
        ignored: ['**/dynpage2res', '**/node_modules']
    }
}

这是我的 angular.json 的一部分。

        "architect": {
            "build": {
                "builder": "@angular-builders/custom-webpack:browser",
                "options": {
                    "customWebpackConfig": {
                        "path": "./extra-webpack.config.js",
                        "mergeRules": {
                            "externals": "replace"
                        }
                    },


            ...
            "serve": {
                "builder": "@angular-builders/custom-webpack:dev-server",
                "options": {
                    "customWebpackConfig": {
                        "path": "./extra-webpack.config.js"
                    },
                    "browserTarget": "inax:build"
                },

但这会导致错误:

Schema validation failed with the following errors:
  Data path "" must NOT have additional properties(customWebpackConfig).

我前段时间写了这两个文件的第一部分(解析,构建),因为我需要在我的角度应用程序中使用 fs 并且这很有效。第二部分(watchOptions,serve)是我认为正确的设置来指定 Live Reload 应该忽略的目录。

标签: angulardirectorylivereload

解决方案


推荐阅读