Как изменить пути к изображениям в метатеге во время производственной сборки? - PullRequest
Новая
       34

Как изменить пути к изображениям в метатеге во время производственной сборки?

0 голосов
/ 22 марта 2020

community,

Первоначально я задавал этот вопрос на https://github.com/gatsbyjs/gatsby/issues/22454, но поскольку я до сих пор не получил никаких указаний, я повторно публикую этот вопрос здесь.

Любая помощь приветствуется!

Резюме

Я хочу использовать Helmet для добавления карты в Твиттер. Однако я не совсем понимаю, какой путь следует указывать в атрибуте content ? Предполагая, что у меня есть изображение на src/imgs/post1.jpg, как я могу указать путь, который будет работать в сборках dev и production?

Local Build 
<meta name="og:image" content="src/imgs/post1.jpg">`
Production Build

И какой путь будет в производстве строить? и как он будет заменен? Нужно ли что-то делать? 

<meta name="og:image" content="?????">`

Окружающая среда (при необходимости) 

System:
    OS: macOS 10.15.1
    CPU: (4) x64 Intel(R) Core(TM) i7-5557U CPU @ 3.10GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 10.15.3 - ~/.nvm/versions/node/v10.15.3/bin/node
    Yarn: 1.13.0 - /usr/local/bin/yarn
    npm: 6.4.1 - ~/.nvm/versions/node/v10.15.3/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 80.0.3987.149
    Firefox: 72.0.2
    Safari: 13.0.3
  npmPackages:
    gatsby: ^2.18.17 => 2.18.17
    gatsby-image: ^2.2.32 => 2.2.32
    gatsby-image-sitemap: ^1.2.1 => 1.2.1
    gatsby-plugin-google-analytics: ^2.1.28 => 2.1.28
    gatsby-plugin-iubenda-cookie-footer: ^1.1.1 => 1.1.1
    gatsby-plugin-material-ui: ^2.1.6 => 2.1.6
    gatsby-plugin-mdx: ^1.0.57 => 1.0.57
    gatsby-plugin-react-helmet: ^3.1.14 => 3.1.14
    gatsby-plugin-robots-txt: ^1.5.0 => 1.5.0
    gatsby-plugin-sharp: ^2.2.38 => 2.2.38
    gatsby-plugin-sitemap: ^2.2.21 => 2.2.21
    gatsby-plugin-typography: ^2.3.14 => 2.3.14
    gatsby-source-filesystem: ^2.1.33 => 2.1.33
    gatsby-transformer-sharp: ^2.3.4 => 2.3.4
  npmGlobalPackages:
    gatsby-cli: 2.8.3

1 Ответ

0 голосов
/ 22 марта 2020

Я думаю, что ваша проблема будет решена с помощью относительный путь .

Вы также можете найти лучший практический пример здесь .

Все, что вам нужно сделать, это найти местоположение фактического файла и файла изображения.

Предположим, у нас есть каталог проекта, подобный следующему:

sr c

imgs

post1.jpg

index. js

Итак, вы необходимо определить ваш адрес следующим образом: ./imgs/post1.jpg.

Он будет искать в том же каталоге, где находится index.js, и искать папку imgs и т. д.

...