Typescript 防止在使用webpack为web部署Electron应用程序时发出某些代码

我有一个用TypeScript编写的基于电子的应用程序。为了捆绑代码，我在gulpfile中运行webpack，它可以针对Electron，当然也可以针对浏览器。相应的配置如下所示：

const appCompile = gulp.src(`${sourceFolder}/Typescript/Main.ts`)
    .pipe(webpackStream({
        module: {
            rules: [
                {
                    loaders: ["babel-loader", "ts-loader"],
                    exclude: [/node_modules/]
                },
            ]
        },
        resolve: {
            modules: ["Source/Typescript", "node_modules"],
            extensions: [".tsx", ".ts", ".js"]
        },
        output: {
            filename: "Bundle.js"
        },
        mode: buildConfiguration.isDevelopment ? "development" : "production",
        externals: externals,
        target: targetPlatform.isWeb ? "web" : "electron-renderer",
        devtool: buildConfiguration.isDevelopment ? "source-map" : "none"
    }, webpack))
    .pipe(gulp.dest(paths.scripts.dest));

目前，我有一些代码行只打算在本地运行的开发模式下执行，而不是在main中！进程，因为它包含一些低级fs代码。在为web运行要部署的webpack时，是否有任何方法可以防止发出这些线路/调用？类似于if isElectron{doSomethinglogly；}之类语句的全局常数

编辑：特别是从fs导入像导入*这样的fs；为卷筒纸而不是电子包装时出现预期错误。即使我可以使用const isElectron=navigator.userAgent.indexOfElectron！==-1.这无助于我有条件地导入。

Webpack具有节点配置对象，您可以在其中告诉它目标何时为web

例如，如果要从fs导入*作为fs；若要导致fs未定义，您可以尝试将此行添加到网页包配置：

node: targetPlatform.isWeb ? {fs: 'empty'} : undefined,

然后，在运行时，您可以检查结果，并避免使用未定义的fs方法：

import * as fs from "fs";

if (fs.writeFile) {
}

---

使用您建议的解决方案，它正在成功传输，但在尝试调用fs.writeFile等方法时，浏览器仍会引发异常。fs对象似乎既不是null、false也不是未定义的。在这种情况下，fs是空对象，{}。我更新了答案。如果Object.keysfs.length！==0{}我刚刚遇到了一个使用适当ES6的更好的解决方案：-通过这种方法，我可以将所有关键代码封装在一个模块中，我可以有条件地导入该模块，而无需手动将所有使用的节点模块添加到webpack配置中。谢谢你。