>웹 프론트엔드 >프런트엔드 Q&A >반응은 거의 ie8을 지원합니다

반응은 거의 ie8을 지원합니다

WBOY
WBOY원래의
2022-05-05 15:06:062555검색

반응에서 ie8을 지원하는 가장 높은 버전은 "react@0.14" 버전입니다. 이보다 높은 버전은 ie8과 호환되지 않습니다. "index.html" 파일 "es5-sham.js" 두 파일의 메소드는 반응이 ie8과 호환되게 만듭니다.

반응은 거의 ie8을 지원합니다

이 튜토리얼의 운영 환경: Windows 10 시스템, ECMAScript 버전 6.0, Dell G3 컴퓨터.

react는 IE8을 거의 지원합니다

React에서 공개한 공식 정보에 따르면 IE8을 지원하는 최고 버전은 React@0.14 버전입니다.

이 버전보다 높으면 문제가 있을 수 있고, 우리 버전과 호환되지 않기 때문에 사용 시 사용 중인 React 버전이 React0.14 버전보다 높은지 확인이 필요하며,

물론 공식 버전에도 있습니다. es5-shim.js와 es5-sham.js 두 파일을 index.html 파일에 추가하는 호환 방법도 제공됩니다.

또한 보장해야 합니다. 사용된 jQuery 버전은 jQuery2.0보다 높은 버전이 아닙니다. jQuery2.0 이상은 IE8에서 지원되지 않기 때문입니다. 부트스트랩 프레임워크를 사용하는 경우 jQuery 버전은 최소한 jQuery 1.9 이상이어야 합니다.

react는 사용자 인터페이스 구축을 위해 Facebook에서 출시한 JavaScript 라이브러리입니다. React는 주로 UI를 구축하는 데 사용됩니다. 많은 사람들이 React를 MVC의 V(뷰)로 생각합니다. React는 높은 성능과 매우 간단한 코드 로직을 가지고 있으며 점점 더 많은 사람들이 이에 주목하고 사용하기 시작했습니다.

ReactJS는 Facebook에서 구축한 JavaScript 웹 라이브러리 세트로 주로 고성능의 반응형 사용자 인터페이스를 구축하는 데 사용됩니다. React는 다른 JavaScript 프레임워크가 직면하는 일반적인 문제, 즉 대용량 데이터 세트를 처리하는 문제를 해결합니다. 가상 DOM을 사용하고 패치 설치 메커니즘을 사용하여 변경 사항이 발생할 때 DOM의 더러운 부분만 다시 렌더링할 수 있기 때문에 React는 다른 프레임워크보다 훨씬 빠른 성능을 달성할 수 있습니다.

지식 확장:

인터넷에서 React를 IE8과 호환되게 만드는 방법을 찾다가 이를 호환 가능하게 만드는 많은 프로젝트를 찾았고, 모두 성공적으로 수정했습니다. 내 프레임워크에서는 여전히 많은 것을 발견했습니다. 수정 사항 요약은 다음과 같습니다.

1. 공식 Weibo 발표에 따르면 IE8을 지원하는 최고 버전은 React@0.14입니다. 이 버전보다 높을 경우 IE8과 호환되지 않으므로 반드시 확인해야 합니다. 사용중인 반응 버전은 IE8보다 0.14와 호환되지 않습니다. 공식 성명에 따르면 호환 방법은 index.html에 es5-shim.js와 es5-sham.js 두 파일(Baidu 검색을 통해 다운로드 가능)만 도입하면 됩니다. 이 두 파일은 수정된 es5 구문입니다. 폴리필은 es3 구문과 호환되지만 이 두 파일이 실제로 프로젝트에 추가된 후에도 일부 오류가 계속 보고됩니다.

2. 사용된 Jquery 버전이 IE8 버전인 Juqery2.x 버전인지 확인하세요. BootStrap 프레임워크를 사용하는 경우 이 프레임워크에 필요한 최소 Jquery 버전은 1.9 이상입니다.

3 다른 두 프레임워크에는 "react-redux": "^4.4.1", "react-router": "^1.0.3"을 사용합니다.

4. package.json에 다음 종속성 패키지를 추가해야 합니다.

 "console-polyfill": "^0.2.2",
    "es5-shim": "^4.4.1",
    "eventsource-polyfill": "^0.9.6",
    "fetch-ie8": "^1.4.0",
   "babel-polyfill": "^6.7.4",

위의 종속성 패키지를 추가한 후 프런트엔드 프로그램 시작 시 위의 여러 설치 패키지를 프로그램에 도입합니다.

require( 'es5-shim');require('es5-shim/es5-sham');require('console-polyfill');require('fetch-ie8');require('babel-polyfill')

5 . 위 단계를 완료한 후에도 ie8은 주로 Object.defineProperty 함수와 관련된 오류를 보고합니다. 이때 package.json에

  "es3ify-loader": "^0.2.0",

를 추가하는 핵심 단계가 필요합니다. 이는 es5 및 es6 구문을 es3 구문으로 변환하는 패키지입니다. 이 패키지는 코드에서 프로그램에 도입될 필요가 없습니다. js 패키징이 완료된 후 이 로더를 사용하여 다시 패키징합니다. 내 app.js는 gulp로 패키징되지만 es3ify-loader는 webpack 패키징 도구

로만 호출할 수 있으므로 프로젝트에 webpack을 설치해야 합니다. 디렉토리에 npm install -g webpack 명령을 입력하세요. 동시에 디렉터리에 webpack.config.js를 생성합니다. 내부 내용은 다음과 같습니다.

var webpack = require('webpack');
 
module.exports = {
    //页面入口文件配置,这里是用gulp打包出来的app.js
    entry: {
        index : './build/app.js'
    },
    //入口文件输出配置,这里需要设置对app.js打包后得到的文件名称
    output: {
        path: './',
        filename: 'bundle.js'
    },
    module: {
        //加载器配置,这里使用es3ify-loader对app.js进行再次打包;
        loaders: [
             {
                test: /\.js?$/,
                loaders: ['es3ify-loader'],
             },
        ]
    },
};

위 단계를 완료한 후 프로젝트 디렉터리에 webpack 명령을 입력하면 패키징 후 자동으로 번들링이 시작됩니다.

6 위 단계를 완료하면 IE8에서 React+Redux+Ruoter 프레임워크의 호환성 수정이 완료됩니다. 이것이 나의 완전한 수정 과정입니다. 수정이 완료된 후 프로그램은 IE8에서 원활하게 실행됩니다. 전체 프런트 엔드가 단일 페이지 애플리케이션으로 작성되었기 때문에 IE8에서는 페이지 전환 새로 고침이 여전히 상대적으로 느립니다.

【관련 추천: javascript 비디오 튜토리얼, web front-end

위 내용은 반응은 거의 ie8을 지원합니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.