vue脚手架搭建项目的兼容性配置详解
更新时间：2018年07月17日 11:10:30 作者：十月秋
这篇文章主要介绍了vue脚手架搭建项目的兼容性配置详解，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
使用vue-cli搭建项目，面临着解决ie兼容性问题(ie9+)，因为ie浏览器并不支持es6语法等。
首先安装babel-polyfill，解决ie不支持promise对象的问题
npm install --save-dev babel-polyfill
安装成功之后,在main.js第一行引入
import 'babel-polyfill'
安装引入成功之后，如果项目还不能正常运行
则需要安装babel进行解析
（推荐阮一峰老师的文章https://www.jb51.net/article/141931.htm）
我自己是安装了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)
}
在module里配置需要进行编译的文件夹(如下)
module:{
rules:[
{
test: /\.js$/,
loader: 'babel-loader',
include: [
resolve('../src'), resolve('../config'),
resolve('../libs'), resolve('../node_modules/iview')
],
query: {
presets: ['es2015']
}
},
]
}
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
本文主要介绍了nuxt.js框架使用小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2023-08-08
这篇文章主要介绍了keep-alive不能缓存多层级路由菜单问题解决，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-03-03
这篇文章主要介绍了vue中如何动态获取剩余区域的滚动高度问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-05-05
本文主要介绍了Vue3刷新页面报错404的解决方法，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-04-04
Vue2.0基于vue-cli+webpack父子组件通信(实例讲解)
下面小编就为大家带来一篇Vue2.0基于vue-cli+webpack父子组件通信(实例讲解)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-09-09
今天我们来学习一下watch侦听器的好兄弟 watchEffect 侦听器。这个相对来说比较简单，用的不是很多，当然了，根据自己的项目情况自行决定使用，希望对大家有所帮助2022-07-07
这篇文章主要介绍了vue实现div可拖动位置也可改变盒子大小，本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-09-09
vue elementUI select下拉框设置默认值(赋值)失败的解决
这篇文章主要介绍了vue elementUI select下拉框设置默认值(赋值)失败的解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10
vue elementUI el-form 数据无法赋值且不报错的问题及解决方法
vue项目中使用elementUI的el-form组件,里面有部分后端数据遍历的字段和部分确定的字段,遇到个问题遍历的字段可以修改值但是确定的几个字段无法修改值,下面小编给大家分享vue elementUI el-form 数据无法赋值且不报错的问题及解决方法,感兴趣的朋友一起看看吧2023-12-12
这篇文章主要给大家介绍了关于Element UI表单验证规则动态失效问题的解决办法,Element UI提供了强大的表单验证功能,可以轻松地对表单进行验证,需要的朋友可以参考下2023-09-09
最新评论