刚完成 Iblog 博客项目,在 chrome 浏览器调试完后,用 Safari 打开网站,页面一直停留在加载状态。

后来网上说这是 Safari 不支持 ES6 所致。

经过搜索,在 github 上有人遇到并解决了这个问题:

vue-router + webpack dose work on Safari

  • 引入 babel-polyfill 和 whatwg-fetch 模块:
npm install babel-polyfill  whatwg-fetch --save-dev 
  • 然后在 webpack 项目 config 目录下的 index.js 文件中加入:
...
entry: {
app: ['babel-polyfill', 'whatwg-fetch', './src/main.js'],
},
...

重新构建项目,成功在 Safari 中打开项目。

【踩坑】Safari不兼容webpack封装的vue项目的更多相关文章

  1. 手把手使用 Webpack 4 建立 VUE 项目

    手把手使用 Webpack 4 建立 VUE 项目 安装 node.js 略 安装 cnpm 略 安装 webpack cnpm install webpack -g 安装 vue-cli cnpm ...

  2. webpack踩坑之路——构建基本的React+ES6项目

    转自:http://www.cnblogs.com/ghost-xyx/p/5483464.html webpack是最近比较火的构建工具,搭配上同样比较火的ReacJS与ES6(ES2015)一定是 ...

  3. 使用 webpack 手动搭建 vue 项目

    webpack 是一个前端工程化打包工具,对于前端工程师来说 webpack 是一项十分重要的技能.下面我们就通过搭建一个 vue 项目来学习使用 webpack 主要环境: node v14.15. ...

  4. better-scroll快速上手及封装(vue项目)

    愿你有诗有梦,有坦荡荡的远方 本文声明:这是一篇学习coderwhy老师的vue2课程的一个笔记,所以本文章是在vue项目中实现,没学过vue的大佬们可以举一反三. 使用场景及介绍 BetterScr ...

  5. vue全家桶安装以及修改webpack配置新增vue项目启动方式

    一.安装node环境(自带npm) 下载地址 二.替换下载源 // 淘宝 NPM 镜像 npm install -g cnpm --registry=https://registry.npm.taob ...

  6. 在webpack搭建的vue项目中如何管理好后台接口地址

    在最近做的vue项目中,使用了webpack打包工具,以前在做项目中测试环境和生产环境的接口地址都是一样的,由于现在接口地址不一样,需要在项目打包的时候手动切换不同的地址,有时候忘记切换就要重新打包, ...

  7. 小程序 ----踩坑 ---安卓iOS兼容等

    关于小程序一些小功能的代码都在这个GitHub上,感兴趣的可以去看看,https://github.com/huihuijiang/miniProgram目前有:列表左滑删除,拖拽浮标 一.小程序坑1 ...

  8. 【React踩坑记六】create-react-app创建的react项目通过iP地址访问(实现局域网内访问)

    同项目组的小伙伴想用自己的电脑访问我电脑上开发阶段的create-react-app创建的react项目. 试过了了各种内网穿透工具ngrok以及localtunnel等. 奈何打开效率实在太过于龟速 ...

  9. webpack初步搭建Vue项目

    对文件进行打包 1. cnpm i -D webpack webpack-cli 本地热更新 1. cnpm i -D webpack-dev-server 处理图片资源 url-loader依赖fi ...

随机推荐

  1. hdu-5673 Robot(默次金数)

    题目链接: Robot Time Limit: 12000/6000 MS (Java/Others)  Memory Limit: 65536/65536 K (Java/Others) 问题描述 ...

  2. 数论 N是完全平方数 充分必要条件 N有奇数个约数

    N是完全平方数 <----> N有奇数个约数 设:N = n*n 充分性: 1.N=1时,N的约数为1,为奇数 2.N>1时,1.....n......N,其中 1, n, N为N的 ...

  3. JDK1.8中对hashmap的优化

    在Java编程语言中,最基本的结构就是两种,一个是数组,另外一个是模拟指针(引用),所有的数据结构都可以用这两个基本结构来构造的,HashMap也不例外.HashMap实际上是一个“链表散列”的数据结 ...

  4. error:: undefined reference to symbol '__glewBufferSubData' 未定义的引用 以及 error: main.o: undefined reference to symbol 'glTexImage2D'

    在把DSO移植到QT工程中,出现了 /usr/bin/ld: KeyFrameDisplay.o: undefined reference to symbol '__glewBufferSubData ...

  5. 1.8 Hive运行日志配置和查看

    一.配置文件 1.重命名配置文件 # 把/opt/modules/hive-0.13.1/conf/hive-log4j.properties.template重命名为hive-log4j.prope ...

  6. sql语句之查询操作

    语法顺序: select distinct 字段1,字段2,字段3 from 库.表 where 条件 group by 分组条件 having 过滤 # 执行顺序的话,到这步会返回运行select语 ...

  7. Oracle中的集合运算

    前言:在实际项目中对多表进行集合运算使用非常广泛,以下是对集合操作的部分总结. 一,建表,插入测试数据 create table a( numbers integer ) create table b ...

  8. E20180715-hm

    grapefruit n. 葡萄柚,西柚; 葡萄柚树;

  9. 学习RESTFul架构

    一.RESTFul介绍 1.一种软件架构风格,设计风格而不是标准,只是提供了一组设计原则和约束条件.它主要用于客户端和服务器交互类的软件.基于这个风格设计的软件可以更简洁,更有层次,更易于实现缓存等机 ...

  10. jq weui 滚动加载的坑

    1.一般情况下使用官网给个demo就可以了,如下: var loading = false; //状态标记 $(document.body).infinite().on("infinite& ...