【发布时间】：2019-02-21 11:16:44
【问题描述】：
运行命令 npm run build 后，我得到了构建文件，没有任何错误，但是当我尝试运行应用程序时，它显示空白页和错误为
我找不到问题出在哪里，我的 index.html 文件就像
`<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<meta name="description" content="dashboard, admin, template, templates, sigma, bootstrap 4, react 4 templates, react 4 themes">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- icons -->
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.png">
<link rel="manifest" href="%PUBLIC_URL%/assets/icons/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<!-- <meta name="msapplication-TileImage" content="%PUBLIC_URL%/assets/icons/ms-icon-144x144.png"> -->
<meta name="theme-color" content="#ffffff">
<link href="https://fonts.googleapis.com/css?family=Inconsolata:400,700|Roboto:400,500,700" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/weather-icons/2.0.9/css/weather-icons.min.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/weather-icons/2.0.9/css/weather-icons-wind.min.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
</head>
<body>
<div id="root"></div>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=key&libraries=places"></script>
</body>
</html>`
我的 package.json
{
"name": "sigma",
"version": "1.0.0",
"private": true,
"dependencies": {
"approve": "0.0.12",
"approvejs": "^3.1.1",
"axios": "^0.18.0",
"babel-polyfill": "^6.26.0",
"bootstrap": "^4.1.1",
"chartist": "^0.11.0",
"d3": "^5.5.0",
"font-awesome": "^4.7.0",
"froala-editor": "^2.9.1",
"gulp": "^3.9.1",
"harmony-reflect": "^1.6.0",
"i18n": "^0.8.3",
"ionicons": "^4.1.2",
"lodash": "^4.17.10",
"mgr-pdf-viewer-react": "^1.0.1",
"minimist": "^1.2.0",
"moment": "^2.22.2",
"mustache": "^2.3.0",
"prop-types": "^15.5.10",
"rc-slider": "^8.3.1",
"react": "^16.4.1",
"react-chartist": "^0.13.0",
"react-datamaps": "^0.4.1",
"react-datetime": "^2.9.0",
"react-dom": "^16.4.0",
"react-easy-chart": "^1.0.0",
"react-faux-dom": "^4.2.0",
"react-froala-wysiwyg": "^2.9.1-1",
"react-google-maps": "^9.4.5",
"react-intl-tel-input": "^5.0.5",
"react-loadable": "^5.4.0",
"react-places-autocomplete": "^7.2.0",
"react-rating": "^1.3.0",
"react-redux": "^5.0.6",
"react-render-html": "^0.6.0",
"react-router-dom": "^4.0.0-beta.8",
"react-router-redux": "^5.0.0-alpha.6",
"react-scripts": "^1.0.11",
"react-select": "^1.0.0-rc.5",
"react-spinners": "^0.3.2",
"react-transition-group": "^2.3.1",
"reactable": "^0.14.1",
"reactstrap": "^6.0.1",
"reapop": "^1.1.2",
"recharts": "^1.0.0-alpha.3",
"recompose": "^0.27.1",
"redux": "^4.0.0",
"redux-thunk": "^2.2.0",
"serve-favicon": "^2.5.0",
"socket.io": "^2.1.1",
"socket.io-client": "^2.1.1",
"source-map": "^0.7.3",
"source-map-explorer": "^1.4.0"
},
"devDependencies": {
"node-sass-chokidar": "^1.3.0",
"npm-run-all": "^4.1.3"
},
"babel": {
"presets": [
[
"env",
{
"modules": false
}
],
"react"
]
},
"scripts": {
"analyze": "source-map-explorer build/static/js/main.*",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"build-css": "node-sass-chokidar --include-path ./src/scss --include-path ./node_modules src/scss -o src/css",
"watch-css": "npm run build-css && node-sass-chokidar --include-path ./src/scss --include-path ./node_modules src/scss -o src/css --watch --recursive",
"start-js": "react-scripts start",
"start": "npm-run-all -p watch-css start-js",
"build": "npm run build-css && react-scripts build"
}
}
【问题讨论】：
-
你的 react 和 react-dom 版本在你的 package.json 中必须相同
-
试过了，但我仍然遇到同样的错误
-
您是否尝试过运行您的
analyze脚本，即检查您的 main.js 的脚本，是否有效？您是否检查过 main.js 中的内容并确定该文件中可能存在哪些错误内容？ -
不，我不知道该怎么做？
-
npm 运行分析
标签： javascript reactjs webpack babeljs