Question

我正在从webpack生成一个构建。但是，无论何时生成构建，它都会与其他文件一起创建一个index.html文件，但在index.html中会添加带有后缀“ /”的script标签。我想在webpack中添加配置，以仅添加其他资产的文件名，而不是后缀“ /”

我的index.html：

<head>
  <meta charSet="utf-8" />
  <meta http-equiv="x-ua-compatible" content="ie=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
  <meta name="generator" content="Gatsby 2.1.19" />
  <link as="script" rel="preload" href="/component---src-templates-all-pokemon-js-d59d33d2742ee8d7199e.js" />
  <link as="script" rel="preload" href="/app-a6912420758bcc3e24a1.js" />
  <link as="script" rel="preload" href="/webpack-runtime-65c9ddc0802b64490fd8.js" />
  <link as="fetch" rel="preload" href="/static/d/382/path---index-6a9-UNWMCjcHKgbI17oOwICQKH7zPs.json"
    crossorigin="use-credentials" />
</head>

但是我想要这样的每一件事。

<head>
  <meta charSet="utf-8" />
  <meta http-equiv="x-ua-compatible" content="ie=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
  <meta name="generator" content="Gatsby 2.1.19" />
  <link as="script" rel="preload" href="component---src-templates-all-pokemon-js-d59d33d2742ee8d7199e.js" />
  <link as="script" rel="preload" href="app-a6912420758bcc3e24a1.js" />
  <link as="script" rel="preload" href="webpack-runtime-65c9ddc0802b64490fd8.js" />
  <link as="fetch" rel="preload" href="static/d/382/path---index-6a9-UNWMCjcHKgbI17oOwICQKH7zPs.json"
    crossorigin="use-credentials" />
</head>

我知道我必须更改Webpack配置，但是无法对Gatsby中的所有资产文件执行此操作。我想对我从浏览器加载的每个文件执行此操作。

Answer 1

我认为没有任何方法可以删除开始的斜杠，但是如果您的gatsby站点不是域的根目录，例如www.example.com/blog/，则可以使用路径前缀。

来自the documentation

构建带有路径前缀的网站有两个步骤。


首先在您网站的gatsby-config.js中定义前缀。


gatsby-config.js
    module.exports = {
        // Note: it must *not* have a trailing slash.
        pathPrefix: `/blog`,
    }
然后将--prefix-paths cmd选项传递给Gatsby。

gatsby build --prefix-paths

如何从webpack的资产URL中删除后缀斜杠“ /”。盖茨比

1 个答案: