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. 3-具体学习git--reset回到过去的版本(commit间穿梭),checkout单个文件穿梭

    git log --oneline 命令可以在一块儿显示做过的改动. 我在change 2时忘了一条,想在change 1后再添加一个语句或一个操作,然后这个状态再提交仍作为change 2.将这个s ...

  2. vue的cli中自定义router

    1.安装router npm install vue-router 2.为了方便管理在components同级创建router文件夹 3.在文件夹中创建index.js文件,就是router文件 im ...

  3. Django-类视图与中间件

    ------类视图 1.类视图引入 def register(request): """处理注册"""   # 获取请求方法,判断是GET/ ...

  4. (转) HighCharts 非规律日期 多条曲线的 绘画

    转自:http://blog.csdn.net/z69183787/article/details/8651296 项目中需要为A,B 2个元素 绘出统计值的曲线,但A与B 的 时间点 并不一致,查找 ...

  5. spring整合quartz时间任务调度框架

    spring整合quartz框架 1.创建maven工程 2.导入jar包(pom.xml) <dependencies> <dependency> <groupId&g ...

  6. linux 查询搜索文件指令

    一.which(寻找[执行档]) 二.whereis(由一些特定的目录中寻找文件文件名) 三.locate/updatedb 四.find 个人记录方便自用

  7. java基础-day19

    第08天 异常 今日内容介绍 u  异常体系&异常处理 u  Throwable常用方法&自定义异常 u  递归 第1章   异常产生&异常处理 1.1      异常概述 什 ...

  8. java的并发和多线程

    本文主要讲解Java并发相关的内容,包括锁.信号量.堵塞队列.线程池等主要内容. 并发的优点和缺点 在讲述怎么利用多线程的情况下,我们先看一下采用多线程并发的优缺点. 优点 提高资源利用率 如读取一个 ...

  9. getHibernateTemplate用法

    前提条件:你的类必须继承HibernateDaoSupport 一: 回调函数: public List getList(){ return (List ) getHibernateTemplate( ...

  10. hdu 5092 线裁剪(纵向连线最小和+输出路径)

    http://acm.hdu.edu.cn/showproblem.php?pid=5092 给一个m*n的矩阵,找到一个纵向的"线"使得线上的和最小并输出这条线,线能向8个方向延 ...