问题
Could anyone give a hint where to start to include images and css files into Angular library using ng-packagr?
回答1:
There's an official issue for that question here. It's actually quite simple to include images and the like to your library: You can just copy them to the dist folder manually after ng-packagr
has done its thing.
However, it's more difficult to automate the extraction of those files in projects that'll use your library. In the issue referenced above BenjaminDobler suggests to add the following mapping to the .angular-cli.json
file of any consumer project:
{ "glob": "**/*", "input": "../node_modules/my-lib/assets", "output": "./assets/my-lib/" }
I feel this is more of an NPM issue, though, and there also are bare NPM solutions for it like pkg-assets and npm-assets.
回答2:
It can be automated on Linux with post*
script
"scripts": {
"package": "ng-packagr -p ng-package.json",
"postpackage": "cp -R YOUR_ASSETS_FOLDER dist/YOUR_ASSETS_FOLDER && tar -cvzf dist.tgz -C dist .",
"release": "npm publish dist"
}
回答3:
I also got same problem when I packaging using ngPackagr. So I wrote my own small node script to copy them to the dist folder manually.
npm install wrench
create new js file in the root assets-copy.js
var wrench = require("wrench"),
util = require("util");
var source = "./src/assets";
var target = "./dist/src/assets";
wrench.copyDirSyncRecursive(source, target, {
forceDelete: true
});
console.log("Asset files successfully copied!");
add build script to package.json like below,I called it as manual:assets-copy
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"packagr": "ng-packagr -p ng-package.json",
"assets-copy": "node assets-copy.js"
}
After you run
npm run packagr
Also run our script
npm run manual:assets-copy
It'll copy them to the dist folder manually.
来源:https://stackoverflow.com/questions/46442949/include-assets-when-building-library-using-ng-packagr