基于 Angular 6 的 Progressive Web App - 自定义图标

Question

我正在开发一个基于 Angular6 的白标渐进式网络应用程序。这个应用程序可以被多个客户端使用，根据客户端，我需要使用不同的图标集。

这需要我动态生成 manifest.json 文件。有没有人做过类似的事情？这样做的正确地点是什么？主要.ts？这是一个类似的实现 (http://technowhisp.com/2018/05/05/pwa/dynamic-pwa-manifest/)，但不是在 Angular 环境中。

现在，我们可以生成 manifest.json - 但是，我猜所有客户端的图标都应该实际存在于项目中（例如，在资产文件夹中）。它是否正确？无论如何，我可以从远程（图像）服务器动态下载这些图标吗？

提前致谢 寿司

Answer 1

假设您知道这些图标的图片网址，您可以尝试使用Node Image Downloader。给定 URL，它可以将图像下载到您指定的路径。

npm install --save image-downloader

与 Promise 一起使用：

const download = require('image-downloader')

// Download to a directory and save with the original filename
const options = {
  url: 'http://someurl.com/image.jpg',
  dest: '/path/to/dest'                  // Save to /path/to/dest/image.jpg
}

download.image(options)
  .then(({ filename, image }) => {
    console.log('File saved to', filename)
  })
  .catch((err) => {
    console.error(err)
  })

// Download to a directory and save with an another filename
options = {
  url: 'http://someurl.com/image2.jpg',
  dest: '/path/to/dest/photo.jpg'        // Save to /path/to/dest/photo.jpg
}

download.image(options)
  .then(({ filename, image }) => {
    console.log('File saved to', filename)
  })
  .catch((err) => {
    console.error(err)
  })