Lake's Blog Lake's Blog
首页
HCFrame
  • 博客搭建

    • 搜索引擎
    • SEO优化
    • 问题记录
  • Vue

    • 问题记录
  • uni-app
  • 开发

    • Spring
  • 数据库及中间件

    • Elasticsearch
    • SQL
  • 杂谈

    • 杂谈
  • 微服务

    • nacos
    • CAS
  • 算法说明

    • algorithm
  • leetCode

    • leetCode
  • 代理

    • Nginx
  • Linux

    • ubuntu
  • Docker
  • 数据库
  • 消息队列
  • openwrt
  • 友情链接
关于
  • 网站
  • 资源
  • 分类
  • 标签
  • 归档
GitHub

Lake Liu

很菜的程序员
首页
HCFrame
  • 博客搭建

    • 搜索引擎
    • SEO优化
    • 问题记录
  • Vue

    • 问题记录
  • uni-app
  • 开发

    • Spring
  • 数据库及中间件

    • Elasticsearch
    • SQL
  • 杂谈

    • 杂谈
  • 微服务

    • nacos
    • CAS
  • 算法说明

    • algorithm
  • leetCode

    • leetCode
  • 代理

    • Nginx
  • Linux

    • ubuntu
  • Docker
  • 数据库
  • 消息队列
  • openwrt
  • 友情链接
关于
  • 网站
  • 资源
  • 分类
  • 标签
  • 归档
GitHub
  • 博客搭建

  • VUE

    • 问题记录

      • 前端传值不能带中括号???
      • Vue中使用debounce防抖基于Typescript
      • Vue-typescript项目兼容IE浏览器
        • 一、添加依赖
        • 二、配置 vue.config.js
        • 三、引入包到main.ts
        • 四、创建 .babelrc 文件
        • 五、创建 babel.config.js 文件
        • 六、解决
      • Vue-typescript Long类型失去精度
      • Vue-typescript 打包成app后如何自动更新
      • Vue typescript 如何极限压缩编译静态资源
  • UNIAPP

Vue-typescript项目兼容IE浏览器

# Vue-typescript项目兼容IE浏览器

Vue typescript项目如何兼容ie浏览器

# 一、添加依赖

注意

  1. 此处我用的是yarn包管理,npm也一致,使用npm命令即可

  2. 此处依赖为我使用的版本,其他版本没有测试,推荐与我使用版本一致

添加依赖 @babel/polyfill 此处我用的版本是 "@babel/polyfill": "^7.12.1"

yarn add @babel/polyfill
1

添加依赖 @vue/cli-plugin-babel ,此处我用的版本是 "@vue/cli-plugin-babel": "^4.3.1"

yarn add @vue/cli-plugin-babel
1

# 二、配置 vue.config.js

在 vue.config.js 中添加如下信息

transpileDependencies: ['fuse.js', 'vuex-module-decorators','element-ui'],
1

其中 fuse.js , vuex-module-decorators , element-ui 是需要 babel 进行转义成 es5 的的依赖

如果在使用过程中引入其他的依赖,发现依赖包中不是 es5 语法,也可以添加到此处

# 三、引入包到main.ts

在 main.ts 中添加

import 'core-js/stable'
import 'regenerator-runtime/runtime'
1
2

# 四、创建 .babelrc 文件

在项目根目录创建 .babelrc

写入如下内容

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "entry"
      }
    ]
  ]
}
1
2
3
4
5
6
7
8
9
10

# 五、创建 babel.config.js 文件

在项目根目录创建 babel.config.js 文件

module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ]
}
1
2
3
4
5

# 六、解决

运行项目,打包部署测试一下吧

编辑
#Typescript#Vue
上次更新: 2023/03/24, 08:53:10
Vue中使用debounce防抖基于Typescript
Vue-typescript Long类型失去精度

← Vue中使用debounce防抖基于Typescript Vue-typescript Long类型失去精度→

最近更新
01
IDEA行号太宽
03-11
02
uniapp中实现h5扫码功能(微信版)
08-12
03
Docker安装Rabbitmq
07-22
更多文章>
本站总访问量次 | 您是本站第位访问者
Theme by Vdoing | Copyright © 2020-2024 Lake Liu | MIT License | 背景图、Logo、头像设计@Drrizzee
  • 跟随系统
  • 深色模式
  • 浅色模式
  • 阅读模式