javascript - Ufanget SyntaxError: Uventet token '<' i React-app
Jeg har et problem med React-appen. Ved oppstart av applikasjonen får jeg en feil som nedenfor i Chrome-konsollen:
Jeg har ingen idé hvorfor, jeg går gjennom nesten hvert emne med denne feilen, men ingenting hjelper meg. Dette er koden min:
package.json
{
"name": " ",
"version": "1.0.0",
"private": true,
"scripts": {
"dev": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"lint": "eslint . --ext .ts"
},
"dependencies": {
"@ant-design/icons": "^4.6.2",
"@babel/preset-typescript": "^7.16.7",
"@types/jest": "^27.4.0",
"@types/node": "^17.0.8",
"@types/react": "^17.0.38",
"@types/react-dom": "^17.0.11",
"antd": "^4.16.6",
"axios": "^0.24.0",
"babel-preset-react": "^6.24.1",
"postcss": "^8.4.5",
"prettier": "^2.5.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^5.2.0",
"react-scripts": "5.0.0",
"source-map-loader": "^3.0.1",
"tailwind": "^4.0.0",
"typescript": "^4.5.2"
},
"devDependencies": {
"@babel/core": "^7.16.7",
"@babel/eslint-parser": "^7.16.5",
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^11.2.7",
"@testing-library/user-event": "^12.8.3",
"@types/babel-generator": "^6.25.5",
"@typescript-eslint/parser": "^5.9.1",
"eslint": "^8.6.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.25.4",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-react": "^7.28.0",
"eslint-plugin-react-hooks": "^4.3.0",
"webpack": "^5.61.0",
"webpack-bundle-analyzer": "^4.4.2",
"webpack-dev-server": "^4.7.1",
"webpack-merge": "^5.8.0"
}
}
.babelrc
{
"presets": ["@babel/react", "@babel/typescript", ["@babel/env", { "modules": false }]]
}
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Web site created using create-react-app" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet" />
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<title> </title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
kan noen fortelle meg hva som er galt?
takk for all hjelp!
PS. Jeg bruker tsx med react/typescript
Svar #1
Jeg ville prøvd å manuelt skrive inn %YOUR_URL%/bundle.js i nettleseren din.
Sannsynligheten er at serveren sender deg en 404 HTML-side i stedet for den forventede JS-bunten.

