html - 使用 Gatsby 无法在 React 上本地加载图像

Question

我遇到了一个奇怪的问题，如果我尝试在本地加载图像，则会出现编译错误。

这是我的编译错误：编译错误

import { Link } from 'gatsby'
import * as React from 'react'
import test from '..\images\128PxNewAcluLogo2017Svg.png'

const IndexPage = () => {
  return (
    <main>
      <img src={test} alt="test" />
    </main>
)
}

export default IndexPage

从在线资源加载图像有效。有任何想法吗？

标签： htmlreactjsgatsby

Answer 1

不要使用反斜杠（\），像这样使用它：

import { Link } from 'gatsby'
import * as React from 'react'
import test from '../images/128PxNewAcluLogo2017Svg.png'

const IndexPage = () => {
  return (
    <main>
      <img src={test} alt="test" />
    </main>
)
}

export default IndexPage

否则，它将被解释为转义值。