首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

pdfmake无法运行ng build --pro Angular 7

pdfmake是一个用于在浏览器中生成PDF文件的JavaScript库。它提供了丰富的API和功能,可以轻松地创建复杂的PDF文档。

在Angular 7项目中使用pdfmake时,可能会遇到无法运行ng build --prod命令的问题。这通常是由于pdfmake库的一些依赖项没有正确地打包到最终的生产构建中所导致的。

解决这个问题的一种方法是手动将pdfmake的依赖项添加到Angular项目的构建配置中。首先,确保你已经安装了pdfmake库,可以通过运行以下命令来安装:

代码语言:txt
复制
npm install pdfmake --save

然后,打开Angular项目的angular.json文件,找到"architect" -> "build" -> "options" -> "scripts"部分。在这个数组中,添加以下两个脚本:

代码语言:txt
复制
"node_modules/pdfmake/build/pdfmake.js",
"node_modules/pdfmake/build/vfs_fonts.js"

这将确保pdfmake的依赖项被正确地包含在构建中。

完成上述步骤后,再次运行ng build --prod命令,应该能够成功构建项目并生成PDF文件。

pdfmake的优势在于它提供了丰富的功能和灵活的API,可以轻松地创建复杂的PDF文档。它支持各种文本样式、表格、图像、列表、页眉页脚等元素,并且可以自定义页面布局和样式。pdfmake还支持添加链接、书签、水印等高级功能。

pdfmake的应用场景非常广泛,包括但不限于以下几个方面:

  • 生成报告和文档:pdfmake可以用于生成各种类型的报告和文档,如销售报告、财务报表、合同等。
  • 打印和导出功能:pdfmake可以用于在网页中提供打印和导出PDF的功能,使用户可以方便地保存和共享网页内容。
  • 电子书和文档编辑器:pdfmake可以用于创建电子书和文档编辑器,用户可以在浏览器中编辑和保存PDF文件。
  • 在线表单和调查问卷:pdfmake可以用于创建在线表单和调查问卷,用户可以填写表单并生成PDF文件。

腾讯云提供了一系列与PDF生成和处理相关的产品和服务,其中包括云函数SCF、对象存储COS、内容分发网络CDN等。您可以通过以下链接了解更多关于腾讯云的相关产品和服务:

  • 云函数SCF:腾讯云的无服务器计算服务,可以用于执行PDF生成和处理的后端逻辑。
  • 对象存储COS:腾讯云的对象存储服务,可以用于存储和管理生成的PDF文件。
  • 内容分发网络CDN:腾讯云的内容分发网络服务,可以加速PDF文件的传输和分发。

希望以上信息能够帮助您解决问题并了解更多关于pdfmake和腾讯云的相关内容。如果您有任何进一步的问题,请随时提问。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Angular CLI 使用教程指南参考

安装 要安装Angular CLI你需要先安装node和npm,然后运行以下命令来安装最新的Angular CLI: 注意:Angular CLI 需要Node 4.X 和 NPM 3.X 以上的版本支持...该值将被强制转换为正确的类型,或者如果类型无法强制,则会抛出错误。 参数 描述 --global 设置全局配置值,而不是本地配置值。 这也使ng set可以在项目之外工作。...# 这是生产构建 ng build --target=production --environment=prod ng build --prod --env=prod ng build --prod...# 这是开发构建 ng build --target=development --environment=dev ng build --dev --e=dev ng build --dev ng build...ng lint 命令 描述 ng lint 在项目上运行codelyzer linter ng test 命令 描述 ng test [options] 使用 karma 运行单元测试 参数 描述

3K50

Angular 工具篇之npx及angular-cli-ghpages

当然你也可以运行下面的命令,进行进一步确认: $ which npx /Users/fer/.nvm/versions/node/v9.11.0/bin/npx 如果发现本地无法直接使用 npx,我们需要以全局的方式安装一下...source-map-explorer dist/main.d72e9d91fd17f9fe7b8c.js (示例来源 —— Angular 工具篇之分析包的大小) 然而,如果使用 npx 的话,我们就可以简化上述的命令...,如: $ npx source-map-explorer dist/main.d72e9d91fd17f9fe7b8c.js 上述的命令,将会运行本地项目中安装的 source-map-explorer...前,你需要进行项目构建,这时你可以执行以下命令: $ ng build --prod --base-href "https://USERNAME.github.io/REPOSITORY_NAME/"...或者使用以下命令: $ ng build --prod --base-href "/REPOSITORY_NAME/" 在项目构建完成后,就可以通过以下的命令自动地把本地项目发布到 Github Pages

1.9K20

玩转 Angular 环境变量

build --prod 那么有的同学,可能想到对于构建测试环境的包,是不是只要运行: $ ng build --test 想象中很完美,但实际上并不是这样,ng build 命令并不支持 --test...参数,感兴趣的同学可以运行 ng build --help 命令查看 ng build 命令所支持的参数: usage: ng build [options] options:...build --configuration=test 上述命令成功运行之后,就会在根目录下生成 dist 目录,并且在该目录下也会创建一个 PROJECT-NAME 目录。...不过与 ng build 命令一样,我们也需要配置一下 angular.json 文件: "serve": { "builder": "@angular-devkit/build-angular:...}, 之后,我们就可以在命令行运行以下的命令,来启用测试环境: $ ng serve --configuration=test 总结 本文简单介绍了 Angular 项目中,environment.ts

3.2K20

Angular 工具篇之分析包的大小

: $ npm i webpack-bundle-analyzer --save-dev 接下来我们使用 Angular CLI 来构建项目,在构建的时候,需要添加相关参数,具体如下: $ ng build.../node_modules/.bin/webpack-bundle-analyzer dist/stats.json 以上命令成功运行后,控制台会输出以下信息: Webpack Bundle Analyzer...在 angular6-example-app 项目中,也为我们提供了相应的 npm script,具体如下: "bundle-report": "ng build --prod --stats-json...首先我们先来在当前项目中安装 source-map-explorer: $ npm i source-map-explorer --save-dev 然后在重新进行项目构建: $ ng build --...为了方便操作,我们也可以定义一个 npm script 任务来处理上述的工作: "map-explorer": "ng build --prod --source-map && source-map-explorer

2.3K40

Angular CLI 常用终端操作命令

CLI常用命令 ---- ng new project-name - 创建一个新项目,置为默认设置 ng build - 构建/编译应用 ng test - 运行单元测试 ng e2e - 运行端到端(...关CLI构建编译项目 ---- 输入命令 ng build 来编译项目,生成编译后的文件存放目录在 项目根目录下 dist/ 目录下面 关于...CLI 构建正式服务器打包文件和测试环境文件还有本地文件 ---- ng build 可以同时指定要与该构建(或)一起使用的构建目标( --target...ng build --environment=loca ng build --environment=prod 关于代理服务器 ---- 在webpack的dev服务器中使用代理支持,我们可以高速缓存某些...更多angular-cli配置 https://github.com/angular/angular-cli/wiki 组件| ng g component my-new-component 指令|

2.1K40

Angular Schematics 三部曲之 Add

该系列文章的三部分将分别介绍 Add、Generation 以及 Update,即使分了三部分来讲解 schematics,但我相信依然无法介绍的面面俱到。那遇到问题应该怎么办呢?...Add 的用途 在我目前见过的项目中,ng add 主要有两个用途: 初始化组件库(比如 angular material,ng-zorro,ngx-bootstrap) 初始化项目模板(比如 ng-alain...发布 Schematics 因为 schematics 就是一套执行脚本,所以在项目发布之前需要将 schematics 的编译文件复制到项目目录,否则也无法使用 schematics。...初始化项目的原始模板文件 删除 ng new 生成的重复文件(因为 schematic 无法自动替换文件) 把原始项目模板文件拷贝到项目目录 调整一下 package.json 和 angular.json...添加一些额外的 module 执行 npm install 安装 package 以下是 @angular/material 的 ng add 逻辑,ng-matero 与此类似。

1.3K10

Angular学习(02)--Angular-CLI命令

Angular-CLI 大体上两种类型的命令,一是创建或修改文件,二是类似运行某个脚本来编译、构建项目。...还有,运行项目时,会使用 build 或 server 命令。 所以,下面就只介绍这三个命令,其他命令,等到后续有接触,深入了解后再补充。...ng build 该命令用来将 Angular 项目编译、打包输出到指定目录下,最终输出的文件就是些 HTML,CSS,JavaScript 这些浏览器能够识别、运行的文件。...那么,这种时候就不能用 ng server 命令了,只能使用 ng build 命令,但该命令,默认只是编译项目,那么岂不是每次代码发生修改,都得重新跑一次 ng build 命令?...项目使用 ng build 命令编译输出到后端项目的容器中,后端跑起来,就可以直接在本地调试了。

2.6K10

Angular10配置webpack打包 「详细教程」

添加ngx-build-plus: ng add ngx-build-plus npm 包管理器 AngularAngular CLI 和 Angular 应用都依赖于某些库所提供的特性和功能,它们都是...要想创建工作区和初始应用项目: 运行 CLI 命令 ng new,并提供一个名字 my-app,如下所示: ng new my-app ng new 会提示你要把哪些特性包含在初始的应用项目中。...添加ngx-build-plus: ng add ngx-build-plus 注意:如果要将其添加到projects文件夹中的特定子项目,请使用--project开关指向它:ng add ngx-build-plus...--project getting-started 备注:这一步通过NPM安装包,在Angular >= 7 and CLI >= 7版本中,让您的项目使用自定义生成器的更新您的angular.jsonng...serve和ng build

4.8K20

发布 Angular 应用至生产环境

而如今 Angular 已经到了 7.x 版本, 对应的工具也是非常的完善, 也就不在使用 rollup 来处理 angular 项目。...(甚至还出现开发机内存不足,无法成功编译的情况) 预先压缩 js 文件 当然, 仅仅考合理划分 js 模块的话, 还往往不太够, 因为单个模块也可能会比较大, 可能会超过 1 兆, 特别是使用了一些第三方控件...针对这种情况, 通常还需要对编译生成的 js 文件进行 gzip 压缩, 因此在执行 ng build --prod 编译之后, 再继续执行下面的 shell 命令: find dist -name "...的模板项目为例, 生成的 js 文件如下所示: 1.8K dist/ng-seed/4.1495aba38157395f4a2d.js 1.7K dist/ng-seed/5.ec7eb27ea7c8eee53bcc.js...1.7K dist/ng-seed/5.ec7eb27ea7c8eee53bcc.js 888B dist/ng-seed/5.ec7eb27ea7c8eee53bcc.js.gz 482K dist

1K50
领券