next.js报错: error in ./static/images/logo.svg

在next.js项目中import svg图片时报错:./static/images/logo.svg 1:0,Module parse failed: Unexpected token (1:0),You may need an appropriate loader to handle this file type.

分析:从提示信息中可以看出,我的项目中使用了svg图片,需要某个loader进行装载。报错组件内容如下:

import React from "react"
import logo from '../static/images/logo.svg'

class Advertise extends React.Component{
    render(){
        return (
            <div>
                <img src={logo} alt="ads"/>
            </div>
        );
    }
}
export default Advertise

解决办法:
安装next-images

npm install --save next-images
or
yarn add next-images

然后在next.config.js文件中加入该loader配置

const withImages = require('next-images')
module.exports = withImages()

最后重启下项目就可以了。

the end

热门文章