primeNG> 7

Question

我在角度应用程序中使用primeng。我想在其中一个组件中添加一些功能，因此我按照说明（https://github.com/primefaces/primeng/wiki/Building-From-Source）完成了所有更改。现在我想打包它，以便我可以在我的应用程序中安装这个修改过的分支。我该怎么做呢？

我之前使用ng2-bootstrap通过运行＆nbsp pack＆＃39;来完成此操作。然后在我的应用程序中安装生成的tar包。我尝试用primeng做同样的事情，但我的项目错误，因为primeng.js文件不在那里。我假设我需要采用不同的方式，但我不知道如何以及我没有多少webpack / gulp经验。

Answer 1

在分叉的PrimeNG repo package.json中需要使用以下行进行更新以构建和重新分发。

添加到package.json

  "scripts": {
    "build-components": "ngc -p tsconfig-release.json",
    "build-assets": "gulp build-assets",
    "build-styles": "node-sass src/assets/components -o src/assets/components",
    "build-redistribute": "npm run build-components && npm run build-assets && npm run build-styles"
  }
  "devDependencies": {
    "node-sass": "^4.5.3",
  }

安装node-sass并运行以下命令来构建

npm run build-redistribute

参考：https://forum.primefaces.org/viewtopic.php?p=159783#p159783

Answer 2

分叉到您的GitHub帐户
克隆包
制作新分支
更改新分支

然后按顺序运行以下命令;

npm install - 下载依赖项

gulp build - 为css创建资源包

npm run build-prod - 运行构建脚本。

然后，您可以将此软件包推送到您自己的GitHub帐户并使用不同的分支名称，并在项目中运行以下需要自定义构建的内容：

npm install git://github.com/<user>/<project>.git#<branch>

然后，当priming在master上进行更改时，您可以将它们与自定义分支合并。

Answer 3

primeNG> 7

（可选）在package.json中添加dist脚本以构建分发文件

{
  "name": "primeng",
  "version": "7.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "dist": "ngc -p tsconfig-release.json && gulp build-assets && gulp build-exports"
  },

然后做一个

npm run dist

请注意，在7.0.0版中，运行此命令时会抛出随机错误

[08:38:19]开始“主题” ... events.js：174 投掷者//未处理的“错误”事件 ^ 错误：ENOENT：没有这样的文件或目录，stat'primeng / resources / components / accordion / accordion.css'

另一个

[08:35:44] 134毫秒后“图像”错误 [08:35:44]错误：EEXIST：文件已存在，mkdir'primeng / resources / images'

我认为这是由于赛车状况或其他原因。如果发生这种情况，请再次尝试该命令，直到其正确构建为止。

您也可以在不添加脚本的情况下运行命令

npm install
./node_modules/.bin/ngc -p tsconfig-release.json
./node_modules/.bin/gulp build-assets
./node_modules/.bin/gulp build-exports

然后您可以生成一个tar.gz文件，您可以在项目中使用该文件

npm pack

并使用

安装到您的项目中

npm install ~/primeng/primeng-7.0.0.tar.gz

npm install docs指出您也可以使用文件夹，因此，您也可以安装为

npm install ~/primeng/

我尝试过，但是它在我的项目中引发了以下异常，因此我不得不使用tar.gz

StaticInjectorError（平台：核心）[RouterOutlet-> ChildrenOutletContexts]： NullInjectorError：ChildrenOutletContexts没有提供者！

您也可以在npm上发布自己的版本

npm login
npm publish

并使用它代替原始的官方发行版

npm install @youruser/primeng

通过@Anulal向我们指出正确方向的信息

Answer 4

primeng> = 9 构建过程已更改为在primeng 9中使用ng-packagr。此方法已在primeng 10中得到确认。

要构建一次，请先安装ng-packager：

npm install ng-packager --save-dev

每次运行都要构建

npm run build-lib

我还没有使用ng-packagr构建版本9。根据此link应该相同。

PrimeNG：如何打包＆＃39;或者＆＃39; build＆＃39;改造后的项目？

4 个答案:

primeNG> 7