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


Posted in Javascript onJuly 17, 2018

使用vue-cli搭建项目,面临着解决ie兼容性问题(ie9+),因为ie浏览器并不支持es6语法等。

首先安装babel-polyfill,解决ie不支持promise对象的问题

npm install --save-dev babel-polyfill

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

import 'babel-polyfill'

安装引入成功之后,如果项目还不能正常运行

则需要安装babel进行解析

(推荐阮一峰老师的文章https://3water.com/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']
      }
    },
  ]
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
修复IE9&safari 的sort方法
Oct 21 Javascript
jquery focus(fn),blur(fn)方法实例代码
Dec 16 Javascript
浅谈javascript原型链与继承
Jul 13 Javascript
javaScript中的原型解析【推荐】
May 05 Javascript
jQuery Easyui使用(二)之可折叠面板动态加载无效果的解决方法
Aug 17 Javascript
微信小程序图片选择、上传到服务器、预览(PHP)实现实例
May 11 Javascript
vue-cli下的vuex的简单Demo图解(实现加1减1操作)
Feb 26 Javascript
JS 实现微信扫一扫功能
Sep 14 Javascript
Vue.extend实现挂载到实例上的方法
May 01 Javascript
你或许不知道的一些npm实用技巧
Jul 04 Javascript
微信小程序实现点击图片放大预览
Oct 21 Javascript
JS实现音乐钢琴特效
Jan 06 Javascript
使用svg实现动态时钟效果
Jul 17 #Javascript
详解.vue文件中style标签的几个标识符
Jul 17 #Javascript
webstrom Debug 调试vue项目的方法步骤
Jul 17 #Javascript
vue实现未登录跳转到登录页面的方法
Jul 17 #Javascript
打通前后端构建一个Vue+Express的开发环境
Jul 17 #Javascript
详解如何从零开始搭建Express+Vue开发环境
Jul 17 #Javascript
微信小程序自定义组件之可清除的input组件
Jul 17 #Javascript
You might like
德劲1107的电路分析与打磨
2021/03/02 无线电
德生1994机评
2021/03/02 无线电
PHP 第三节 变量介绍
2012/04/28 PHP
php导入excel文件到mysql数据库的方法
2015/01/14 PHP
PHP微信开发之二维码生成类
2015/06/26 PHP
php统计数组元素个数的方法
2015/07/02 PHP
php获取从百度、谷歌等搜索引擎进入网站关键词的方法
2015/07/08 PHP
php获取错误信息的方法
2015/07/17 PHP
Symfony2获取web目录绝对路径、相对路径、网址的方法
2016/11/14 PHP
DWZ+ThinkPHP开发时遇到的问题分析
2016/12/12 PHP
PHP实现文件下载【实例分享】
2017/04/28 PHP
PHP实现QQ、微信和支付宝三合一收款码实例代码
2018/02/19 PHP
同一页面多个商品倒计时JS 基于面向对象的javascript
2012/02/16 Javascript
基于JQuery模仿苹果桌面的Dock效果(初级版)
2012/10/15 Javascript
window.open打开页面居中显示的示例代码
2013/12/27 Javascript
JS获得图片alt信息的方法
2015/04/01 Javascript
javascript去除空格方法小结
2015/05/21 Javascript
无刷新上传文件并返回自定义值
2015/06/11 Javascript
深入解析JavaScript中的arguments对象
2016/06/12 Javascript
Angular.Js中过滤器filter与自定义过滤器filter实例详解
2017/05/08 Javascript
详解Vue 全局引入bass.scss 处理方案
2018/03/26 Javascript
Vue手把手教你撸一个 beforeEnter 钩子函数
2018/04/24 Javascript
vue2.0+vue-router构建一个简单的列表页的示例代码
2019/02/13 Javascript
详解JavaScript 的变量
2019/03/08 Javascript
Python Mysql自动备份脚本
2008/07/14 Python
简介Python的collections模块中defaultdict类型的用法
2016/07/07 Python
pandas object格式转float64格式的方法
2018/04/10 Python
python多维数组切片方法
2018/04/13 Python
python pandas.DataFrame选取、修改数据最好用.loc,.iloc,.ix实现
2018/06/11 Python
Django中信号signals的简单使用方法
2019/07/04 Python
Python 解析简单的XML数据
2020/07/24 Python
浅析Python模块之间的相互引用问题
2021/02/26 Python
售后服务承诺书
2014/03/26 职场文书
应届毕业生求职信范文
2014/07/07 职场文书
2014高中生入党思想汇报范文
2014/09/13 职场文书
最美劳动诗,致敬所有的劳动者!
2019/07/12 职场文书