Question

尝试使用汇总功能预加载图像时遇到问题。所有应该起作用的废话都没有，不知道为什么。是否有人设法使其正常工作？这是我在rollup.congig.js中拥有的东西：

import image from 'rollup-plugin-image'
...
plugins: [
        image(),
        json(),
        resolve(),
        commonjs(),
        typescript({
            typescript: require('typescript'),
        }),
        (process.env.BUILD === 'production' ? terser() : {})

以下是我的资料来源：

import CAR_IMAGE from "../resources/expand.png";

最后，我从rtp2插入中得到一个错误：

语义错误TS 2307，找不到模块“ ../ resources / expand.png”

奇怪的是，我与其他各种用于汇总的图像加载插件一样。路径正确，图像在那里。我已经为这个错误=（（

更新：以下是可复制此错误的存储库：

https://github.com/AntonPilyak/rollup-image-bug

更新2：已创建错误：

https://github.com/rollup/rollup-plugin-url/issues/22

https://github.com/alwaysonlinetxm/rollup-plugin-img/issues/5

https://github.com/rollup/rollup-plugin-image/issues/10

怎么这么烂？ =（（（

Answer 1

在rollup.config.js中用此package替换 rollup-plugin-image 包。
并在插件下面添加类似的内容

plugins: [
image({
  extensions: /\.(png|jpg|jpeg|gif|svg)$/,
  limit: 10000
}),........

然后在根项目中创建文件名 declaration.d.ts 。在以下代码段中添加

declare module '*.png' {
const value: any;
export default value;

}

将此代码段添加到您的 tsconfig.json

"include": ["src","src/declaration.d.ts"],

在CLI中重新运行汇总。会的！?

汇总+打字稿+将图像加载为base64

1 个答案: