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. IntelliJ IDEA 2017版 编译器使用学习笔记(十) (图文详尽版);IDE快捷键使用;IDE关联一切

    关联一切 一.与spring关联      通过图标跳转相关联的类 设置关联:进入project structure ===>facets =>选加号,===>选spring,默认添 ...

  2. 避免使用eval()

    eval()可以将任意的字符串当做一个JavaScript代码来执行. eval()使用实例: // 烦模式 var property = 'name'; console.log(eval('obj. ...

  3. 预装apk

    一般是在device/rockchip/ LOCAL_PATH := $(call my-dir)include $(CLEAR_VARS)LOCAL_MODULE := LanguageSetLOC ...

  4. HTTP请求模型和头信息参考

    发送HTTP请求:一个请求由四个部分组成:请求行.请求头标.空行和请求数据 请求行 请求行由三个标记组成:请求方法.请求URI和HTTP版本,它们用空格分隔.例如:GET /index.html HT ...

  5. AngularJS实战之cookie的读取

    <!DOCTYPE html> <html ng-controller="cookies_controller"> <head> <tit ...

  6. poj 1068 Parencodings 模拟题

    Description Let S = s1 s2...s2n be a well-formed string of parentheses. S can be encoded in two diff ...

  7. wget批量下载http文件

    eg:http://hgdownload.soe.ucsc.edu/goldenPath/hg19/encodeDCC/wgEncodeAwgDnaseUniform/ 下载该路径下的所有文件 wge ...

  8. 树形控件(CTreeCtrl和CTreeView)

    如何插入数据项目? 如何添加鼠标右击事件? 插入数据项 通过InsertItem()方法,有四种重载样式: HTREEITEM InsertItem(LPTVINSERTSTRUCT lpInsert ...

  9. IGServer

    默认运行的服务器程序 (这种没有界面的中间服务件程序但在进程中可以查看到) C/C++ 服务器编程(VS.Linux.测试/维护)C/C++网络编程

  10. 20169207《Linux内核原理与分析》第十周作业

    这周除了阅读学习教材「Linux内核设计与实现 (Linux Kernel Development)」第教材第15,16章外.我们还需要接着完成学习MOOC「Linux内核分析」第八讲「Linux系统 ...