When I start the application I get the following error:
[vite] Internal server error: Unable to parse HTML; parse5 error code eof-in-element-that-can-contain-only-text at {"file":"/index.html","line":56,"column":1}
at {"file":"/index.html","line":56,"column":1} at handleParseError (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-a713b95d.js:43358:11) at Parser.onParseError (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-a713b95d.js:43285:13) at Parser._err (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-19c40c50.js:4942:14) at eofInText (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-19c40c50.js:6977:7) at Parser.onEof (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-19c40c50.js:5731:17) at Tokenizer._emitEOFToken (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-19c40c50.js:1403:22) at Tokenizer._stateRawtext (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-19c40c50.js:1903:22) at Tokenizer._callState (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-19c40c50.js:1522:22) at Tokenizer._runParsingLoop (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-19c40c50.js:1179:22) at Tokenizer.write (file:///C:/Users/Marco/Documents/Projetos/admooh-presentation/src/node_modules/vite/dist/node/chunks/dep-19c40c50.js:1204:14)
package.json

{
  "name": "admooh-presentation",
  "version": "4.1.0",
  "description": "Admooh presentation project",
  "repository": {
    "type": "git",
    "url": "git://github.com/react-boilerplate/react-boilerplate-typescript.git"
  },
  "license": "MIT",
  "author": "Max Stoiber",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview --port 8080",
    "lint": "npm run typecheck && npm run lint:css && npm run lint:eslint:quiet app",
    "lint:css": "stylelint app/**/*.{js,ts,tsx}",
    "lint:eslint": "eslint --ext .ts,.tsx,.js,.jsx --no-error-on-unmatched-pattern",
    "lint:eslint:fix": "eslint --ext .ts,.tsx,.js,.jsx --no-error-on-unmatched-pattern --quiet --fix",
    "lint:eslint:quiet": "eslint --ext .ts,.tsx,.js,.jsx --no-error-on-unmatched-pattern --quiet",
    "prettify": "prettier --write app ",
    "pretest": "npm run test:clean && npm run lint",
    "test": "vitest run",
    "test:ci": "vitest run",
    "test:clean": "rimraf ./coverage",
    "test:coverage": "vitest run --coverage",
    "test:watch": "vitest watch",
    "typecheck": "tsc --noEmit",
    "storybook": "start-storybook -p 6006",
    "build-storybook": "build-storybook",
    "prepare": "cd .. && husky install"
  },
  "lint-staged": {
    "*.{md,json}": [
      "prettier --write",
      "git add --force"
    ],
    "*.{ts,tsx,js,jsx}": [
      "npm run lint:eslint:fix",
      "git add --force"
    ]
  },
  "dependencies": {
    "@devexpress/dx-core": "3.0.5",
    "@devexpress/dx-react-chart": "3.0.5",
    "@devexpress/dx-react-chart-material-ui": "3.0.5",
    "@devexpress/dx-react-core": "3.0.5",
    "@hookform/resolvers": "2.9.8",
    "@mui/icons-material": "^5.10.3",
    "@mui/lab": "5.0.0-alpha.99",
    "@mui/material": "^5.10.5",
    "@mui/styled-engine-sc": "^5.10.3",
    "@mui/x-date-pickers": "^5.0.1",
    "@react-google-maps/api": "2.12.2",
    "@rjsf/bootstrap-4": "^4.2.3",
    "@rjsf/core": "^4.2.3",
    "@textea/json-viewer": "^1.24.4",
    "@uppy/core": "3.0.1",
    "@uppy/dashboard": "^3.0.1",
    "@uppy/drag-drop": "^3.0.0",
    "@uppy/file-input": "^3.0.0",
    "@uppy/locales": "3.0.0",
    "@uppy/progress-bar": "^3.0.0",
    "@uppy/react": "3.0.1",
    "@uppy/tus": "3.0.1",
    "@uppy/xhr-upload": "^3.0.1",
    "bootstrap": "^4.6.2",
    "copy-to-clipboard": "^3.3.2",
    "crypto-js": "^4.1.1",
    "currency.js": "2.0.4",
    "date-fns": "2.29.3",
    "immer": "9.0.15",
    "intl": "1.2.5",
    "jsdom": "^20.0.0",
    "lodash": "4.17.21",
    "mixpanel-browser": "^2.45.0",
    "mui-tel-input": "^2.0.1",
    "node-fetch": "^3.2.10",
    "notistack": "3.0.0-alpha.7",
    "ramda": "0.28.0",
    "react": "18.2.0",
    "react-beautiful-dnd": "13.1.1",
    "react-bootstrap": "^1.6.6",
    "react-dom": "18.2.0",
    "react-error-boundary": "3.1.4",
    "react-hook-form": "7.35.0",
    "react-input-mask": "^2.0.4",
    "react-intl": "6.1.1",
    "react-jsonschema-form": "1.8.1",
    "react-query": "3.39.2",
    "react-responsive": "9.0.0-beta.10",
    "react-responsive-carousel": "3.2.23",
    "react-router-dom": "^6.4.0",
    "react-table": "7.8.0",
    "react-youtube": "10.0.0",
    "sanitize.css": "13.0.0",
    "styled-components": "5.3.5",
    "typescript-plugin-styled-components": "2.0.0",
    "use-immer": "0.7.0",
    "use-places-autocomplete": "4.0.0",
    "vest": "3.2.8",
    "yup": "0.32.11",
    "zod": "^3.19.1"
  },
  "devDependencies": {
    "@hookform/devtools": "4.2.2",
    "@storybook/addon-actions": "^6.5.12",
    "@storybook/addon-essentials": "^6.5.12",
    "@storybook/addon-links": "^6.5.12",
    "@storybook/react": "^6.5.12",
    "@stylelint/postcss-css-in-js": "^0.38.0",
    "@testing-library/jest-dom": "5.16.5",
    "@testing-library/react": "13.4.0",
    "@testing-library/user-event": "14.4.3",
    "@types/google.maps": "^3.50.1",
    "@types/lodash": "4.14.185",
    "@types/node": "18.7.18",
    "@types/ramda": "0.28.15",
    "@types/react": "18.0.20",
    "@types/react-beautiful-dnd": "13.1.2",
    "@types/react-dom": "18.0.6",
    "@types/react-responsive": "8.0.5",
    "@types/react-router-dom": "5.3.3",
    "@types/styled-components": "5.1.26",
    "@types/testing-library__jest-dom": "5.14.5",
    "@typescript-eslint/eslint-plugin": "5.37.0",
    "@typescript-eslint/parser": "5.37.0",
    "@vitejs/plugin-react": "2.1.0",
    "@vitest/ui": "^0.23.2",
    "cross-env": "7.0.3",
    "eslint": "8.23.1",
    "eslint-config-airbnb-typescript": "17.0.0",
    "eslint-config-prettier": "8.5.0",
    "eslint-import-resolver-typescript": "3.5.1",
    "eslint-plugin-import": "2.26.0",
    "eslint-plugin-jest-dom": "^4.0.2",
    "eslint-plugin-jsx-a11y": "6.6.1",
    "eslint-plugin-prettier": "4.2.1",
    "eslint-plugin-react": "7.31.8",
    "eslint-plugin-react-hooks": "4.6.0",
    "eslint-plugin-storybook": "^0.6.4",
    "eslint-plugin-testing-library": "^5.6.4",
    "husky": "^8.0.1",
    "lint-staged": "13.0.3",
    "msw": "0.47.3",
    "postcss-syntax": "^0.36.2",
    "prettier": "2.7.1",
    "rimraf": "3.0.2",
    "stylelint": "14.11.0",
    "stylelint-config-recommended": "9.0.0",
    "stylelint-config-styled-components": "0.1.1",
    "stylelint-processor-styled-components": "1.10.0",
    "typescript": "4.8.3",
    "vite": "^3.1.1",
    "vitest": "^0.23.2"
  },
  "engines": {
    "node": ">=10.13.0",
    "npm": ">=6.4.1"
  },
  "msw": {
    "workerDirectory": "public"
  }
}

Can anyone tell me what the error could be?
Already adjusted the dependencies, already deleted the nodemodules and installed again.
Node version: 16.17

我刚刚发现了问题所在。Sine版本3.1.0 vite使用parse5作为html解析器。由于某些原因，这导致了崩溃。您应该锁定3.0.9上的vite依赖项。
编辑：
所以，我终于弄清楚了什么问题是我的html文件，因为有一个需要更新到最新的vite版本.这是因为html文件格式，parse5抛出当你有这样的html样式

<noscript
      ><div>
        <h1 style="margin: 16px; font-size: 26px">
          No js detected
        </h1>
        <p style="font-size: 18px">
          Turn your js on
        </p>
      </div></noscript
    >

注意<noscript后面的新行，这就是问题所在。它必须是没有空行的<noscript>。显然，这同样适用于其他标签。这真的很愚蠢，因为这是完全有效的，有些格式化程序确实这样格式化html。

3条答案

按热度按时间

8zzbczxx1#

您可能也应该在问题中包含HTML文件。
在我的情况下，我发现问题是无效的HTML不完全在同一行。我有一个自关闭脚本标记，看起来像：
<script type="text/javascript" src="/src/index.js"/>是无效的HTML。将其更改为<script type="text/javascript" src="/src/index.js"></script>可以修复它。请参阅Why don't self-closing script elements work?

赞(0）回复(0）举报 2023-04-11

c9x0cxw02#

siv3szwd3#

使用最新版本

我在index.html中遇到了同样的问题。添加一些上下文：prettier无法格式化文件。
将react Vite项目更新到最新的稳定版本修复了该问题。

"vite": "^4.2.0"

"@vitejs/plugin-react": "^3.1.0",

如果您正在启动一个新的Vite项目，请确保使用

yarn create vite

或

npm create vite@latest

@latest在使用npm时是必需的

reactjs 使用vite启动react时出错(parse 5错误代码eof-in-element-that-can-contain-only-text)

3条答案

使用最新版本

相关问题

热门标签

最新问答