刚完成 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. DBCPTool

    dbcp读取配置文件的方式: 1. 导入3个包:commons-dbcp-...  .jar(数据源) commons-collections-.....jar(集合) commons-pool... ...

  2. JNI——JAVA调用C

    1. 编译java:javac JNIDemo.java 2. 编译JNI:gcc -I/usr/lib/jvm/java-1.8.0-openjdk-amd64/include/ -I/usr/li ...

  3. Java--23种设计模式之decorator模式

    装饰模式:装饰模式以对客户端透明的方式扩展对象的功能,是继承关系的一个替代方案,提供比继承更多的灵活性.动态给一个对象增加功能,这些功能可以再动态的撤消.增加由一些基本功能的排列组合而产生的非常大量的 ...

  4. force

    题意 求解 Ei = Fi/qi 解法: 方法一: 考虑左侧的式子,直接多项式乘法. 对于右面的式子,我们记做$B_j$,这样有 $$B_j = \sum_{j<i}{ revq_{n-i} f ...

  5. HrrpClient使用

    使用HttpClient获取网页内容的过程 1.创建一个CloseableHttpClient类的实例: 2.使用这个实例执行HTTP请求,得到一个HttpResponse的实例: 3.最后,通过Ht ...

  6. Tomcat-redis-Nginx

    环境:centos7, Tomcat7, redis-3.2,Nginx1.8,jdk-8u60-linux-x64 Nginx反向代理tomcat,redis作会话共享 一.Nginx安装 解决依赖 ...

  7. 28.Docker介绍与目录

    快速的部署和启动 docker的启动是毫秒级的.一分钟可移动几百个上千个docker的容器 docker和虚拟机的区别 虚拟机在里面独立运行完整的操作系统.资源上时间上都需要多. docker容器级别 ...

  8. 3-1Java程序的执行流程

    3-1Java程序的执行流程 用记事本写一个简单的程序 存到:E:\java路径下 class HelloImooc{    public static void main(String[] agrg ...

  9. 201621123016《Java程序设计》第三周学习总结

    1. 本周学习总结 1.初学面向对象,会学习到很多碎片化的概念与知识.尝试学会使用思维导图将这些碎片化的概念.知识点组织起来.请使用工具画出本周学习到的知识点及知识点之间的联系.步骤如下: 1.1 写 ...

  10. TP5之查询那些事

    1.使用 model 查询,查出的类型为 对象 $a 是一个对象,使用 $a->name 的方式来获取 对象里的属性 2.使用 db 查询,查询出的是 数组 $b 是一个数组,使用 $b['na ...