Rollup.js打包图片。

Question

Rollup.js打包图片。

6

在webpack世界中，我可以使用file-loader来打包和访问图片的url。

就像这样:

const webpackConfig = {
  // ...
  module: {
    rules: [
      {
        test: /\.(jpg|png|svg)$/,
        use: [
          {loader: 'file-loader?name=[path][name].[hash].[ext]'}
        ],
        include: paths
      }
    ]
  }
}

例如，在React组件中使用它的方式如下：

import foo from 'assets/images/foo.png'

function ReactFunctionalComponent () {
  return (<img src={foo} />)
}

那将把foo与图像的路径连接起来

在rollup js上是否有一种方法，使我可以在捆绑包中使用带哈希的图像资源作为URL？

- FabioCosta

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Isidrok · Accepted Answer

你可以使用插件来增强rollup的功能。在这种情况下，可以使用rollup-plugin-image（https://github.com/rollup/rollup-plugin-image）或者更为灵活的rollup-plugin-img（https://github.com/alwaysonlinetxm/rollup-plugin-img）。

请注意，此技术可能会增加文件的大小。