React+Webpack生产环境部署后页面空白,控制台报错求助
React生产环境部署后空白页且控制台报错排查
我尝试将React Web应用部署到生产环境,但UI显示空白页,控制台存在报错。此前直接在主机部署时生产应用运行完全正常,但通过Docker部署时,执行npm ls发现存在包依赖问题。
Package.json
{ "name": "webpackreact", "version": "1.0.0", "description": "", "main": "option.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "webpack-dev-server --port 3000 --hot --progress --inline", "build": "webpack --mode production" }, "author": "", "license": "ISC", "dependencies": { "babel": "^6.5.2", "babel-core": "^6.18.2", "download-file": "^0.1.5", "draft-js": "^0.10.0", "google-map-react": "^0.24.0", "jquery-file-download": "^1.4.6", "react": "^15.4.2", "react-addons-css-transition-group": "^15.4.1", "react-ckeditor-wrapper": "^1.1.2", "react-dom": "^15.4.2", "react-file-download": "^0.3.4", "react-iframe": "^1.3.3", "react-js-pagination": "^3.0.2", "react-md-spinner": "^0.2.5", "react-meta-tags": "^0.1.3", "react-overlay-loading": "^1.0.3", "react-popup": "^0.9.3", "react-recaptcha": "^2.3.10", "react-router": "^3.0.0", "react-rte": "^0.11.0", "react-search": "^2.0.5", "react-share": "^2.4.0", "react-social-buttons": "^1.0.8", "react-spinners": "^0.3.2", "react-tabs-component": "^1.1.3", "react-text-truncate": "^0.13.1", "react-texteditor": "^0.1.1", "react-word-limit": "^1.0.0", "webpack": "^1.14.0", "webpack-dev-server": "^1.16.2", "winterfell": "^1.1.1" }, "devDependencies": { "babel-core": "^6.18.2", "babel-loader": "^6.2.7", "babel-preset-es2015": "^6.18.0", "babel-preset-react": "^6.16.0", "react-hot-loader": "^3.0.0-beta.6", "webpack": "^1.13.3" } }
Dockerfile
FROM node:12.1.0-slim as build WORKDIR /app COPY ./code/package*.json ./ RUN npm install RUN npm install webpack@1.14.0 -g COPY ./code ./ RUN webpack --mode production FROM nginx:1.23 COPY --from=build /app/static /usr/share/nginx/html/static COPY --from=build /app/index.html /usr/share/nginx/html/index.html EXPOSE 80 CMD ["nginx", "-g", "daemon off;"]
Nginx配置(default.conf)
server { listen 80; server_name _; server_tokens off; root /usr/share/nginx/html; index index.html; add_header X-Frame-Options SAMEORIGIN; add_header Strict-Transport-Security "max-age=31536000; includeSubDomains; preload"; location / { try_files $uri $uri/ /index.html; } }
控制台报错截图

内容的提问来源于stack exchange,提问作者Muhsina Fatimatul
相关产品推荐
相关产品推荐

