Webpack 将 '__dirname' 返回为 '/'答案

【问题标题】：Webpack is returning '__dirname' as '/'Webpack 将 '__dirname' 返回为 '/'
【发布时间】：2020-01-08 06:05:12
【问题描述】：

当我尝试使用 Nestjs 后端 webpack 编译 Angular 8 应用程序时，它似乎有问题并返回 __dirname 作为“/”

我尝试使用其他主题的建议在配置中设置 __dirname: true 或 false，似乎 API 不接受此配置。

下面我将默认配置与工厂和我得到的错误一起粘贴

const webpack = require('webpack');
const WebpackConfigFactory = require('@nestjs/ng-universal')
  .WebpackConfigFactory;

module.exports = WebpackConfigFactory.create(webpack, {
  // Nest server for SSR
  server: './server/main.ts'
});

在成功构建后尝试使用“npm run serve:ssr”进行编译时，我得到了这个：

Unhandled Promise rejection: ENOENT: no such file or directory, open '//indexTemplate.html.tpl' ; Zone: <root> ; Task: Promise.then ; Value: { Error: ENOENT: no such file or directory, open '//indexTemplate.html.tpl' at Object.openSync (fs.js:438:3) at Object.readFileSync (fs.js:343:35) at Object.generateHTML (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:80659:16) at Function.setupExpress (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:79512:39) at Function.setup (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:79505:21) at C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:129:33 at Generator.next (<anonymous>) at fulfilled (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:95:58) at Zone.run (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:1633:43) errno: -4058, syscall: 'open', code: 'ENOENT', path: '//indexTemplate.html.tpl' } Error: ENOENT: no such file or directory, open '//indexTemplate.html.tpl' at Object.openSync (fs.js:438:3) at Object.readFileSync (fs.js:343:35) at Object.generateHTML (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:80659:16) at Function.setupExpress (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:79512:39) at Function.setup (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:79505:21) at C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:129:33 at Generator.next (<anonymous>) at fulfilled (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:95:58) at ZoneDelegate.invoke (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:1874:26) at Zone.run (C:\Users\Work\PhpstormProjects\terminal-app\dist\server.js:1633:43)

我已经在nestjs/swagger repo 中将此作为错误提交，因为这主要发生在我所看到的swagger 中。没有注意到纯 Angular 8+ 上的错误。不过，是否有任何解决方法的线索？

【问题讨论】：

标签： webpack swagger nestjs angular-universal

【解决方案1】：

Webpack 默认将mocking __dirname 变量转换为/。

您可以通过禁用此功能来更改它。

// webpack.config.js

module.exports = {
  ...

  node: {
    '__dirname': false
  }
}

【讨论】：

是的，我试过了，但它适用于纯 angular 或纯 nestjs，但是当将它们与 @nestjs/ng-universal 集成时，它会在构建时抛出这个：
配置对象无效。 Webpack 已使用与 API 模式不匹配的配置对象进行初始化。 - configuration.entry 应该是以下之一：function | object { : 非空字符串 | [非空字符串] } |非空字符串 | [非空字符串] -> 编译的入口点。
详细信息： * configuration.entry['node'] 应该是一个字符串。 -> 字符串被解析为启动时加载的模块。 * configuration.entry['node'] 应该是一个数组：[non-empty string] -> 一个非空的非空字符串数组 * configuration.entry['node'] 应该是以下之一：[non-空字符串] -> 所有模块在启动时加载。最后一个是导出的。 * configuration.entry['node'] 应该是以下之一：非空字符串 | [非空字符串] -> 一个有名字的入口点
听起来其中一个部门正在使用旧的 webpack 版本。尝试通过npm ls webpack进行检查
输出为：-- @angular-devkit/build-angular@0.801.3 -- webpack@4.35.2

【解决方案2】：

在你的 webpack.config.js 上试试这个

node: {
    __dirname: true,
    __filename: true, <-- in case of need
},

【讨论】：