vue腳手架搭建專案的相容性配置
阿新 • • 發佈:2018-11-26
使用vue-cli搭建專案,面臨著解決ie相容性問題(ie9+),因為ie瀏覽器並不支援es6語法等。
首先安裝babel-polyfill,解決ie不支援promise物件的問題
npm install --save-dev babel-polyfill
安裝成功之後,在main.js第一行引入
import 'babel-polyfill'
安裝引入成功之後,如果專案還不能正常執行
安裝了babel-preset-es2015和babel-preset-stage-2
在.babelrc裡面進行配置
{ "presets": ["stage-2","es2015"], "plugins": ["transform-vue-jsx", "transform-runtime"] }
然後在webpack.base.config.js進行配置
腳手架搭建的專案裡面都有這個方法:
function resolve(dir) {
return path.join(__dirname, dir)
}全棧開發交流圈一起學習交流:864305860
在module裡配置需要進行編譯的資料夾(如下)
module:{ rules:[ { test: /\.js$/, loader: 'babel-loader', include: [ resolve('../src'), resolve('../config'), resolve('../libs'), resolve('../node_modules/iview') ], query: { presets: ['es2015'] }//歡迎加入全棧開發交流圈一起學習交流:864305860 },//面向1-3年前端人員 ]//幫助突破技術瓶頸,提升思維能力 }
結語
感謝您的觀看,如有不足之處,歡迎批評指正。
本次給大家推薦一個免費的學習群,裡面概括移動應用網站開發,css,html,webpack,vue node angular以及面試資源等。
對web開發技術感興趣的同學,歡迎加入Q群:864305860,不管你是小白還是大牛我都歡迎,還有大牛整理的一套高效率學習路線和教程與您免費分享,同時每天更新視訊資料。
最後,祝大家早日學有所成,拿到滿意offer,快速升職加薪,走上人生巔峰。