前言:在用webpack打包react代码的时候发现一个问题,做一个处理总结。

我的webpack配置:

var webpack = require('webpack');
//打包less插件
var ExtractTextPlugin = require('extract-text-webpack-plugin');
//这里的'./css/bundle.css'设置打包地址
var ExtractLess = new ExtractTextPlugin('./css/bundle.css');
//打包多个文件插件
//var commonsPlugin = new webpack.optimize.CommonsChunkPlugin('common.js');
var path = require('path');
module.exports = {
entry:[
'./reactDom/index.js'
],
output:{
path:'./build',
filename:'indexReact.js'
},
module:{
loaders:[
{test: /\.js$/, exclude: /(node_modules|bower_components)/, loader: 'babel',query:{presets:['es2015','react']}},
{test:/\.less$/,loader:ExtractTextPlugin.extract("style-loader", "css-loader!less-loader")},
//图片文件使用 url-loader 来处理,小于8kb的直接转为base64
{ test: /\.(png|jpg)$/, loader: 'url-loader?q=8192'} ]
},
resolve:{
extensions:['','.js']
}, plugins:[
ExtractLess, ]
};

上面看上去一切正常,运行webpack -w时候也没有任何问题

但是如果我使用-p压缩的话就会报错:

解决方案:UglifyJsPlugin插件

   在webpack包里面已经自带这个UglifyJsPlugin,我们只要在webpack中的plugins添加即可,代码如下

 plugins:[
new webpack.optimize.UglifyJsPlugin({
compress:{
warnings:false
},
mangle:{
except:['$super','$','exports','require']
}
})
]

UglifyJsPlugin可以防止$super, $, exports , require,不会被混淆,设置warnings:false就打包时候即可消除warings报警了

webpack -p压缩打包react报语法错误处理的更多相关文章

  1. ajax请求报语法错误

    今天改代码修正完一个ajax请求后,调试发现出错进error方法,查看错误信息报语法错误,具体是调用parseJSON方法时出错,因为我是用json方式传递的参数,所以第一时间查看data参数是否正确 ...

  2. PHP echo一个对象报语法错误,为什么?

    为什么直接echo一个对象就会报语法错误,而如果这个对象实现了__toString方法后就可以直接输出呢? 原因是echo本来可以打印一个对象,而且也实现了这个接口,但是PHP对其做了个限制,只有实现 ...

  3. mybatis 批量update报语法错误解决方法

    1.为什么会报语法错误 原因:在 *.xml文件内使用了循环,在mybatis中默认是不允许使用批量修改. <update id="setMaxMin" parameterT ...

  4. react 报红错误汇总

    react  报红错误汇总 一.Uncaught TypeError: Cannot read property 'value' of undefined 未知类型错:无法读取未定义的属性“value ...

  5. python3下tomorow模块 @thread报语法错误def async(n, base_type, timeout=None): ^ SyntaxError: invalid syntax---解决方法

    遇见问题:python使用tomorrow实现多线程,tomorrow模块的源代码报语法错误? 这是报错信息:Traceback (most recent call last):  File &quo ...

  6. MySQL 灵异事件一则 -- desc报语法错误

    今天有一开发同学找到我,说查询SQL中倒序报错,不明原因,于是奔赴工位现场研究情况. 果然,只要SQL中带有desc 就会报错,而ASC没问题. 哪怕desc放在句首用作explain也会报错. 报错 ...

  7. vue项目在ie浏览器下报语法错误

    错误如下: 1.用vue 写的项目最多可以兼容到IE9 及以上版本 2.使用babel-polyfill做兼容npm install babel-polyfill --save-dev 安装之后如果发 ...

  8. vue webpack 引入iview iview内部文件报语法错误

    错误如下: 是因为 es6 语法没有成功转化 因为 我的项目是别人做好的已经部署的项目 ,但是用到的是es2015  配置es2015并不起作用 是因为es2015已经过期了 安装的时候回有类似下面的 ...

  9. weex初始化启动webpack.common.conf.js中的...报语法错误

    使用Babel转码 // 最新转码规则 $ npm install --save-dev-g babel-preset-env // react转码规则 $ npm install --save-de ...

随机推荐

  1. informatica读取FTP文件

    以下为一个完整的informatica读取ftp文件,并导入到系统中. 第一步: 通过shell脚本下载压缩包文件 /server/infa_shared/crm_prod/shell/ftpFrom ...

  2. markdown语法与使用

    Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式. 语法 # 文本 =>h1标签 ##文本 =>h2标签 *文本* =&g ...

  3. 高程(3):操作符、for、for...in循环、break/continue/return语句、函数等

    1.关系操作符 注意点:1)比较操作数是两个字符串,是比较字符串的字符编码值. 如:"a" > "b"  返回 false:"a" & ...

  4. Java内部类与外部类的那些事

    昨天去笔试的时候遇到了Java的内部类的创建方式与访问权限的问题,我不懂,没写,故今天起来特意去试验一下,就有了这篇总结性的文章. Java中的内部类又分为非静态内部类(匿名内部类也是非静态的内部类) ...

  5. IE7 自动为文件路径添加域名

    对于图片等文件的路径,一般在同一个域名下的文件都会使用相对路径,但如果使用JS获取文件的路径浏览器获取到的路径都是相对路径,但IE7会自动为路径添加域名变成绝对路径... IE7下图片路径,在文件相对 ...

  6. html5 canvas-变幻函数

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. C#对象先序列化然后反序列化时间丢失八小时的问题

    把对象JSON序列化,然后反序列化后发现时间少了八小时.因为在东八区,所以序列的时候按照1970-01-01:08:00:00为基数取得差值,而反序列化的时候以1970-01-01:00:00:00作 ...

  8. Vuejs学习笔记1

    首次写vue可能会出现:[Vue warn]: Cannot find element: #app 这是因为你的js在html页面头部引入的原因,自定义js文件要最后引入,因为要先有元素id,vue才 ...

  9. Windows Server 2008 双网卡同时上内外网 不能正常使用

    Windows server 2008 32位下,双网卡同时上内外网,并提供VPN服务,遇见的奇怪问题 1.服务器配置 2.网络配置 以太网适配器 内部连接: 连接特定的 DNS 后缀 . . . . ...

  10. ThinkPHP学习总结

    ThinkPHP学习总结 网站开发使用的thinkPHP5.0在此总结备查 MVC关系功能图 一.Thinkphp开发规范 l 类 类库.函数文件统一以.php为后缀: 类的文件名均以命名空间定义,并 ...