搭建項(xiàng)目
- create-react-app生成一個(gè)react項(xiàng)目
- 將項(xiàng)目中react&&react-dom版本降到0.14.*
- 增加兼容包
import 'babel-polyfill';
import 'console-polyfill';
import 'fetch-ie8';
import 'es6-promise';
- 讓瀏覽器支持es5的特性宰缤，可以扔到自己CDN上
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-shim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.5.7/es5-sham.min.js"></script>
- 引用es3ify-loader 解決es3語法兼容問題
postLoaders: [
{
test: /\.js$/,
loaders: ['es3ify-loader'],
},
]
- ie8中 缺失：報(bào)錯(cuò) ，注釋掉node_modules/ansi_html/index.js 142-149行
// ansiHTML.tags = {
// get open() {
// return _openTags;
// },
// get close() {
// return _closeTags;
// }
// };
- ie8中router失效問題蔑鹦，router降級(jí)到1.*
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
- UglifyJsPlugin壓縮后出現(xiàn)問題
new webpack.optimize.UglifyJsPlugin({
compress: {
screw_ie8: true, // React doesn't support IE8
warnings: false
},
mangle: {
screw_ie8: true
},
output: {
comments: false,
screw_ie8: true
}
})
主要包版本
"react": "^0.14.2",
"react-dom": "^0.14.2",
"react-router": "^1.0.3",
"redux": "^3.6.0",
"react-redux": "^3.1.2",
"redux-thunk": "^2.2.0"
參考資料
開發(fā)遇到的問題
- input和label，點(diǎn)擊label不會(huì)觸發(fā)radio change事件闷煤。
- 原因爽醋，input display:none||visibility: hidden;，IE無法觸發(fā)不顯示元素的事件
- 解決方案恶座，不想顯示input搀暑，透明度置0
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
