Importing font files (*.woff, *.ttf)

Describe the bug

Loading fonts seems to be failing with:

ModuleBuildError: Module build failed (from ./node_modules/storybook-addon-next/dist/images/next-image-loader-stub.js):
TypeError: unsupported file type: undefined (file: undefined)
    at lookup (/Users/.../node_modules/image-size/dist/index.js:52:11)
    at imageSize (/Users/.../node_modules/image-size/dist/index.js:104:16)

Webpack config shows that the font is being loaded via next-image-loader-stub:

{
    test: /\.(svg|ico|jpg|jpeg|png|apng|gif|eot|otf|webp|ttf|woff|woff2|cur|ani|pdf)(\?.*)?$/,
        use: [
              {
                loader: '/Users/.../node_modules/storybook-addon-next/dist/images/next-image-loader-stub.js',
                options: { filename: 'static/media/[path][name][ext]' }
              }
        ]
  },

Perhaps it’s because font files won’t have a width and height? https://github.com/RyanClementsHax/storybook-addon-next/blob/6583c2080386f72fdebc49ff93a2b8262d1219bc/src/images/next-image-loader-stub.ts#L24

Just guessing… Would love to hear your insights. Thanks!

Your minimal, reproducible example

http://forking.example.on.codesandbox.fails.to.build

Steps to reproduce

1. add a font static asset
2. add css that imports font file
3. storybook start fails

Expected behavior

I expected static file imports to work as before, but next-image-loader-stub seems to be breaking.

How often does this bug happen?

No response

Screenshots or Videos

No response

Platform

• OS: MacOS X
• Node 16

storybook-addon-next version

v1.3.1

Additional context

No response

[czebe]

Thanks Ryan! Fantastic work! I noticed a different, smaller issue as well. Will open another ticket when I get a chance.

[github-actions[bot]]

🎉 This issue has been resolved in version 1.4.1 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀