【问题标题】:No index.html file after gatsby-cli build?gatsby-cli 构建后没有 index.html 文件?
【发布时间】:2019-04-08 18:30:18
【问题描述】:

我正在试验 GatsbyJS。我创建了一个从他们的默认站点生成器派生的新站点并进行了一些更改。当使用gatsby develop 命令时,一切都按预期工作。我去使用gatsby build,它确实生成了一个 /public 文件夹,但是没有“index.html”甚至“bundle.js”

默认站点是否“特殊”,因为它不会以典型方式生成站点?在 gatsby-config 版本中是否需要其他设置来生成 index.html?

/public 目录的ls 返回:

1-5cf9b126c8aa029e3c76.js
1-5cf9b126c8aa029e3c76.js.map
1-f2577b7d9227c6ab20bd.js
1-f2577b7d9227c6ab20bd.js.map
404
app-dc0da5ea76a79bd92e99.js
app-dc0da5ea76a79bd92e99.js.map
app-e2d084d7f150c4a0d4f4.js
app-e2d084d7f150c4a0d4f4.js.map
chunk-map.json
component---node-modules-gatsby-plugin-offline-app-shell-js-896a3f852b233b9ca05e.js
component---node-modules-gatsby-plugin-offline-app-shell-js-896a3f852b233b9ca05e.js.map
component---src-pages-404-js-8e1643e05587f89c70d6.js
component---src-pages-404-js-8e1643e05587f89c70d6.js.map
component---src-pages-404-js-c2122e5847e5d16ffe11.js
component---src-pages-404-js-c2122e5847e5d16ffe11.js.map
component---src-pages-index-js-be99ef46e818d68362b3.js
component---src-pages-index-js-be99ef46e818d68362b3.js.map
component---src-pages-index-js-edad0a6dd0d36ec7cdbd.js
component---src-pages-index-js-edad0a6dd0d36ec7cdbd.js.map
component---src-pages-page-2-js-0479e3779ff85cb5431c.js
component---src-pages-page-2-js-0479e3779ff85cb5431c.js.map
component---src-pages-page-2-js-a49a481686ec152c45b7.js
component---src-pages-page-2-js-a49a481686ec152c45b7.js.map
icons
manifest.webmanifest
offline-plugin-app-shell-fallback
pages-manifest-5c619b10fb87f94c2d85.js
pages-manifest-5c619b10fb87f94c2d85.js.map
pages-manifest-e84c50768dd42edc85fe.js
pages-manifest-e84c50768dd42edc85fe.js.map
render-page.js
render-page.js.map
static
styles-0375cdcc38b87565858c.js
styles-0375cdcc38b87565858c.js.map
styles-b76dfad3fcff2976e17c.js
styles-b76dfad3fcff2976e17c.js.map
styles.fc4fa5e094d218207796.css
webpack-runtime-50855368c384639cab1f.js
webpack-runtime-50855368c384639cab1f.js.map
webpack-runtime-66b8792cf68b5ba07ac4.js
webpack-runtime-66b8792cf68b5ba07ac4.js.map
webpack.stats.json

供参考:

$ gatsby -v
2.5.5

还有 package.json:

{
  "name": "gatsby-starter-default",
  "private": true,
  "description": "A simple starter to get up and developing quickly with Gatsby",
  "version": "0.1.0",
  "author": "Kyle Mathews <mathews.kyle@gmail.com>",
  "dependencies": {
    "gatsby": "^2.3.5",
    "gatsby-image": "^2.0.37",
    "gatsby-plugin-manifest": "^2.0.26",
    "gatsby-plugin-offline": "^2.0.25",
    "gatsby-plugin-react-helmet": "^3.0.11",
    "gatsby-plugin-sharp": "^2.0.32",
    "gatsby-source-filesystem": "^2.0.28",
    "gatsby-transformer-sharp": "^2.1.17",
    "prop-types": "^15.7.2",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-helmet": "^5.2.0"
  },
  "devDependencies": {
    "prettier": "^1.16.4"
  },
  "keywords": [
    "gatsby"
  ],
  "license": "MIT",
  "scripts": {
    "build": "gatsby build",
    "develop": "gatsby develop",
    "format": "prettier --write src/**/*.{js,jsx}",
    "start": "npm run develop",
    "serve": "gatsby serve",
    "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\""
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/gatsbyjs/gatsby-starter-default"
  },
  "bugs": {
    "url": "https://github.com/gatsbyjs/gatsby/issues"
  }
}

【问题讨论】:

  • 你是如何创建它的,有哪些变化?
  • gatsby new site 我制作了一些新组件来替换默认组件
  • 我会尝试删除node_modules 文件夹并再次尝试npm install。另外,您可以发布您的packages.json 文件吗?
  • 啊,我找到了。有一个错误。出于某种原因,您可以在 develop 模式下调用 'fetch',但在运行 build 时需要导入它
  • 很好,很高兴你找到它!

标签: javascript reactjs gatsby


【解决方案1】:

正如上面 cmets 中所述,问题是 gatsby developgatsby build 似乎有不同的要求。在使用bulld 命令时,需要手动导入es6 的fetch 命令(嘘)。

这只是意味着添加行

import 'isomorphic-fetch';

致所有调用fetch 的文件。

【讨论】:

  • 很高兴您解决了问题,gatsby build 在节点环境中生成页面,这意味着它无法访问仅限浏览器的 window 对象。这包括fetchlocationdocument...等内容。如果您打算仅在浏览器中使用fetch,则必须检查window,例如if (typeof window !== 'undefined');否则你必须手动导入一个包(就像你发现的那样)。
猜你喜欢
  • 2019-01-21
  • 2020-12-17
  • 2018-11-21
  • 2020-01-15
  • 2020-07-20
  • 1970-01-01
  • 2015-01-03
  • 2016-11-23
  • 1970-01-01
相关资源
最近更新 更多