首页
学习
活动
专区
工具
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

发布 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

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
领券