如何在Nx monorepo（React）中从assets文件夹导入PDF文件

不用直接修改Webpack配置，Nx下有更规范的解决方式，分两步处理：

1. 给PDF添加TypeScript类型声明 #

TypeScript找不到PDF的类型定义才报的错，手动补一个就行：

• 在项目的src目录或者根目录新建types文件夹，创建pdf.d.ts文件
• 写入代码：

declare module '*.pdf' {
  const src: string;
  export default src;
}

• 打开项目的tsconfig.json，把types文件夹加入include数组：

{
  "include": ["src/**/*", "types/**/*"]
}

2. 确保Nx把PDF当作资源处理 #

还要让打包工具正确识别PDF为静态资源，修改项目根目录的project.json：

• 找到targets.build.options.assets，把PDF所在的路径加进去：

{
  "targets": {
    "build": {
      "options": {
        "assets": [
          "src/assets", // 直接包含整个assets文件夹
          // 也可以单独指定单个文件："src/assets/pdf.pdf"
        ]
      }
    }
  }
}

做完这两步，就能正常导入PDF文件了。Nx默认没处理PDF是因为这类文件不属于通用静态资源（比如图片、字体），所以需要手动补充类型和资源配置。

内容的提问来源于stack exchange，提问作者DevOverflow