美文网首页前端Vue专辑
vue脚手架搭建项目的兼容性配置

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

作者: a333661d6d6e | 来源:发表于2018-11-23 21:57 被阅读3次

使用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,快速升职加薪,走上人生巅峰。

相关文章

  • Vue2.0—— 搭建Vue脚手架(vue-cli)

    给大家介绍下用 Vue2.0 搭建Vue脚手架(vue-cli),在搭建脚手架之前,先做好环境配置。 详细如下: ...

  • 创建vue脚手架vue.cli

    介绍下用 Vue2.0 搭建Vue脚手架(vue-cli),在搭建脚手架之前,先做好环境配置。 详细如下: 1.先...

  • vue2.0+router路由

    1、搭建vue脚手架2、通过vue脚手架,我们搭建好了基础的vue,接下来就开始使用vue-cli来构建基础路由项...

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

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

  • Vue脚手架

    1. Vue 脚手架的基本用法 在没有Vue脚手架的时候,我们需要手动搭建webpack项目、手动去配置vue,现...

  • vue-cli构建项目npm run dev报npm版本错误

    由于之前都是使用cooking脚手架搭建的vue项目,搭建以及运行均正常,今天突然想试下vue-cli脚手架试下项...

  • vue+iview搭建项目

    1、安装配置vue 前提是已经安装并配置好node和npm环境,先搭建vue脚手架 vue-cli # 全局安装 ...

  • VUE学习之路一 项目搭建

    脚手架搭建vue项目框架 CLI3项目搭建查看 搭建方案 vue-cli 是一个官方发布 vue.js 项目脚手...

  • vue.config.js 配置

    vue-config-js配置参考 vue-cli3 脚手架搭建完成后,项目目录中没有 vue.config.js...

  • Vue移动端电商项目1-项目初始化

    项目初始化:脚手架搭建项目 vue-cli3脚手架作用:自动帮我们完成webpack跟Vue相关的所有配置. 全局...

网友评论

    本文标题:vue脚手架搭建项目的兼容性配置

    本文链接:https://www.haomeiwen.com/subject/effrqqtx.html