Приложение реакции отлично работает в Chrome и других браузерах, но возвращает пустую страницу в IE11 - PullRequest
Новая
       6

Приложение реакции отлично работает в Chrome и других браузерах, но возвращает пустую страницу в IE11

0 голосов
/ 07 октября 2019

Мое приложение реакции отлично работает в chrome и других браузерах после производства. Но когда дело доходит до IE, он показывает только пустую страницу с заголовком. Я предполагаю, что он просто загружает index.html, а не файлы javascript. Что я делаю? Я уже пробовал polyfill и core-js. Не повезло.

это package.json

 {
  "name": "wildfire",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@babel/polyfill": "^7.6.0",
    "@types/react-highlight-words": "^0.16.0",
    "@version/react-router-v3": "^1.0.0",
    "antd": "^3.22.1",
    "axios": "^0.19.0",
    "bootstrap": "^4.3.1",
    "core-js": "^3.2.1",
    "react": "^16.8.6",
    "react-app-polyfill": "^1.0.4",
    "react-dom": "^16.8.6",
    "react-router": "^3.2.4",
    "react-router-dom": "^5.0.1",
    "react-scripts": "3.0.1",
    "serve": "^11.2.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      "defaults"
    ],
    "development": [
      "defaults"
    ]
  }
}

это index.js

 import "@babel/polyfill"
    import 'react-app-polyfill/ie11';
    import 'react-app-polyfill/stable';
    import 'core-js/es/map';
    import 'core-js/es/set';
    import 'raf/polyfill'
    import 'core-js/features/number/is-nan';
    import React from 'react';
    import ReactDOM from 'react-dom';
    import {BrowserRouter as Router} from 'react-router-dom'
    import App from './App';
    import 'bootstrap/dist/css/bootstrap.css';
    import 'antd/dist/antd.css'
    import './index.css';
    import * as serviceWorker from './serviceWorker';

    ReactDOM.render(<Router><App /></Router>, document.getElementById('root'));

    // If you want your app to work offline and load faster, you can change
    // unregister() to register() below. Note this comes with some pitfalls.
    // Learn more about service workers: 
    serviceWorker.unregister();

это index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

    <title>IT Forms Portal</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
  </body>
</html>

Я поднял голову и увидел, что есть много людей с такой же проблемой, касающейся IE. Как мне заставить мое приложение работать с IE?

EDIT : как вы можете видеть, я уже пробовал Почему IE 11 отображает приложение реагирования на рендеринг пустой страницы это не такрешать что угодно. что я делаю не так?

1 Ответ

0 голосов
/ 07 октября 2019

Попробуйте добавить следующий метатег в разделе head вашего index.html: 

<meta http-equiv="X-UA-Compatible" content="IE=edge">

Кроме того, из вашего кода кажется, что вы уже установили полифилл, пожалуйста, проверьте пакет. json файл, убедитесь, что у вас есть добавить 11 в этом файле. После этого перезапустите приложение и проверьте, будет ли оно работать в IE11.

Добавьте, например, 11 в «package.json» следующим образом: 

      "browserslist": {
        "production": [
          ">0.2%",
          "not dead",
          "not op_mini all",
          "ie 11"
        ],
        "development": [
          "last 1 chrome version",
          "last 1 firefox version",
          "last 1 safari version",
          "ie 11"
        ]
      }
...