1.npm安装

npm install babel-polyfill
npm install es6-promise

package.json中会出现

"babel-polyfill": "^6.26.0",
"es6-promise": "^4.1.1",

2.main.js引入

import 'babel-polyfill'
import Vue from 'vue'
import Es6Promise from 'es6-promise'
require('es6-promise').polyfill()
Es6Promise.polyfill()

3.webpack.base.conf.js

module.exports = {
entry: {
app: ['babel-polyfill', './src/main.js']
},
module: {
rules: [{
test: /\.vue$/,
loader: 'vue-loader',
options: vueLoaderConfig
},
{
test: /\.js$/,
loader: 'babel-loader',
query:{presets:['es2015']},
include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
},

4.在.babelrc文件里加入

{
"presets":["es2015", "stage-2"],
}

解决白屏(vue) - webpace es6转es5的更多相关文章

  1. ionic2 解决白屏问题

    ionic2下创建项目后,运行启动页后白屏几秒,解决方案 问题描述 最近在学习过程中发现ionic2项目运行在真机上,启动页后会有3-5秒的白屏时间,用户体验不是太好. 解决过程 查看到了一篇关于这个 ...

  2. Vue解决项目白屏

    第一步:  vue-cli项目根目录下面新建Vue.config.js文件  proxy反向代理    module.exports = {   devServer: {     proxy: {   ...

  3. MUI APP防止登陆页面出现白屏

    最近在用MUI开发APP,总体效果,在IOS上,是完美的,但是在低端的Android手机上,就会出现性能问题,我个人觉得最严重的是,就是首页,就是APP打开的第一个页面,在iOS上,由于性能高,所以, ...

  4. iOS使用webView 加载网页,在模拟器中没有问题,而真机却白屏了。App Transport Security has blocked a cleartext HTTP (http://) resource load since it is insecure. Temporary exceptions can be configured via your app's Info.plist f

    还在info.plist中配置.除了配置允许上网的配置之外,还有另一项.

  5. [重磅] 让HTML5达到原生的体验 系列之中的一个 避免切页白屏

    非常多人都想.甚至曾使用HTML5开发跨平台App.而且想达到原生App的体验. 最后的结果都是无奈的放弃.HTML5貌似美好,但坑太多.想做到原生App的体验差点儿不可为. 也曾有过著名的faceb ...

  6. 提升html5的性能体验系列之一避免切页白屏

    窗体切换白屏的现实问题 HTML5的性能比原生差很多,比如切页时白屏.列表滚动不流畅.下拉刷新和上拉翻页卡顿.在低端Android手机上,很多原生App常用的功能和体验效果都很难使用HTML5技术模拟 ...

  7. 提升HTML5的性能体验系列之一 避免切页白屏

    窗体切换白屏的现实问题 HTML5的性能比原生差很多,比如切页时白屏.列表滚动不流畅.下拉刷新和上拉翻页卡顿.在低端Android手机上,很多原生App常用的功能和体验效果都很难使用HTML5技术模拟 ...

  8. vue发布之后会出现白屏现象主要几种原因和解决办法

    第一种:由于把路由模式mode设置成history了,默认是hash. 解决方法:路由里边router/index.js路由配置里边默认模式是hash,如果你改成了history模式的话,打开也会是一 ...

  9. vue2.0在android5.0白屏, es6转es5保证浏览器兼容性

    1. 安装 npm install --save-dev babel-preset-es2015 2. 安装 npm install --save-dev babel-preset-stage-3 3 ...

随机推荐

  1. Java编程从头开始---老妪能解

    思想导向: 今天想要分享的是最基础的东西就是如何写一个简单的代码,很多人都是小白,需要的其实并不是很高端的理论,框架和思维模式啊,设计方法啊,这些对于一个新人来说实在是好高骛远,说的那么高端,结果要学 ...

  2. MongoDB-增删改

    MongoDB的shell使用了Js引擎,因此能运行任意的Js程序. MongoDB中常用基本数据类型: null:空值或者不存在的字段Boolean:true,false数值型:{"x&q ...

  3. WebGIS实现在线要素编辑之ArcGIS Server 发布Feature Service 过程解析

    WebGIS实现在线要素编辑之ArcGIS Server 发布Feature Service 过程解析 FeatureService也称要素服务,其最大的好处就是支持在线要素编辑,并将编辑同步更新到后 ...

  4. vue+大文件分片上传

    最近公司在使用vue做工程项目,实现大文件分片上传. 网上找了一天,发现网上很多代码都存在很多问题,最后终于找到了一个符合要求的项目. 工程如下: 对项目的大文件上传功能做出分析,怎么实现大文件分片上 ...

  5. _编程语言_C++_简介

    扩展名: .cpp..cp或.c C++编译器: GNU的gcc 编译器

  6. [ 9.11 ]CF每日一题系列—— 441C暴力模拟

    Description: n * m 的地图,建设k个管道管道只能横竖走,且长度大于等于2,问你任意一种建设方法 Solution: 图里没有障碍,所以先把前k - 1个管道每个分2个长度,最后一个管 ...

  7. MEAN 27

    添加评论主题页,在26的基础上. 新建了很多文件 Error: Cannot find module './controllers/customers_c' 解决办法:../ 接下来做function ...

  8. js五道经典练习题--第四道qq好友列表

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  9. js五道经典练习题--第三道实现购物车功能

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  10. MySQL--Percona-XtraDB-Cluster 5.6安装笔记

    安装环境: 有三台干净的CentOS 6的服务器,IP配置为:192.168.166.169,192.168.166.170,192.168.166.171,准备搭建三节点的Percona XtraD ...