vue脚手架搭建项目的兼容性配置

使用vue-cli搭建项目,面临着解决ie兼容性问题(ie9+),由于ie浏览器并不支持es6语法等。 首先安装babel-polyfill,解决ie不支持promise对象的问题 css

npm install --save-dev babel-polyfill
复制代码

安装成功以后,在main.js第一行引入html

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进行配置 脚手架搭建的项目里面都有这个方法:vue

function resolve(dir) {
  return path.join(__dirname, dir)
}全栈开发交流圈一块儿学习交流:864305860
复制代码

在module里配置须要进行编译的文件夹(以下)node

module:{
  rules:[
    {
      test: /\.js$/,
      loader: 'babel-loader',
      include: [
        resolve('../src'), resolve('../config'),       
        resolve('../libs'), resolve('../node_modules/iview')
      ],
      query: {
        presets: ['es2015']
      }//欢迎加入全栈开发交流圈一块儿学习交流:864305860
    },//面向1-3年前端人员
  ]//帮助突破技术瓶颈,提高思惟能力
}
复制代码

结语webpack

感谢您的观看,若有不足之处,欢迎批评指正。es6

本次给你们推荐一个免费的学习群,里面归纳移动应用网站开发,css,html,webpack,vue node angular以及面试资源等。 对web开发技术感兴趣的同窗,欢迎加入Q群:864305860,无论你是小白仍是大牛我都欢迎,还有大牛整理的一套高效率学习路线和教程与您免费分享,同时天天更新视频资料。 最后,祝你们早日学有所成,拿到满意offer,快速升职加薪,走上人生巅峰。web

相关文章
相关标签/搜索