Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

webpack3.6.0打包报错 #9

Open
moxiaozhou opened this issue Apr 9, 2019 · 16 comments
Open

webpack3.6.0打包报错 #9

moxiaozhou opened this issue Apr 9, 2019 · 16 comments

Comments

@moxiaozhou
Copy link

image

@moxiaozhou
Copy link
Author

已通过升级uglifyjs为uglifyjs-webpack-plugin解决该问题,但是该插件语法在微信pc端不支持

@BenzLeung
Copy link
Owner

@moxiaozhou 微信pc端是什么鬼?你是如何在微信pc版使用本项目的?

@moxiaozhou
Copy link
Author

就是微信pc版(windows7)。打开分享过来的链接,项目是直接在微信自带的浏览器上打开,场景就是这个样子的

@imndx
Copy link

imndx commented Apr 29, 2019

我们遇到一样的问题,打包提示错误。

@BenzLeung
Copy link
Owner

@moxiaozhou
我检查了微信pc版的 userAgent 如下:

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.95 Safari/537.36 MicroMessenger/6.5.2.501 NetType/WIFI WindowsWechat QBCore/3.43.1021.400 QQBrowser/9.0.2524.400

也就是说微信pc版使用了 Chrome 39 的老内核(现在Chrome都出到74了)。
由于内核太老,我难以保证其兼容性。

已更新 README.md,注明了浏览器兼容性。
后续我将增加兼容性检测功能。在这个功能完成之前,本Issue将一直Open。

@WingsLin
Copy link

同遇到打包提示错误,不过不影响打包。报错如下
ERROR in bundle.js from UglifyJs
SyntaxError: Unexpected token: name (ctx) [./~/benz-amr-recorder/BenzAMRRecorder.js:284,0]
怀疑是ES6语法的问题导致。

@BenzLeung
Copy link
Owner

@WingsLin @moxiaozhou 才看到你们都使用了 UglifyJs。
@imndx 你是不是也一样用了 UglifyJs?

本项目使用了ES6语法,即使是已压缩的 BenzAMRRecorder.min.js 也一样保留了部分ES6语法。
而 UglifyJs 只支持 ES5。它的官方 Github 页 有这个一句:

uglify-js only supports JavaScript (ECMAScript 5).

我之所以没有把它转换成ES5,是因为本项目使用了 Web Audio API,而支持 Web Audio API 的浏览器都已经原生支持了一部分ES6语法,浏览器直接执行 BenzAMRRecorder.min.js 是没有问题的。保留ES6可以让js体积更小。

建议你们改用 terser 打包,它的用法与 UglifyJs 基本相同。
或者把本项目加入 babel 的 include 选项中,让 babel 转换成 ES5。

@WingsLin
Copy link

更正一下,打包报错其实有影响到打包,就是打包出来的js文件没有进行压缩。现已把该项目加入babel的include选项,转换为ES5的语法,就不报错了。谢谢 @BenzLeung ,这个插件真心真心帮了大忙,使用起来非常简便。

@retwert
Copy link

retwert commented May 31, 2019

配置 "extraBabelIncludes": [
"node_modules/benz-amr-recorder"
]之后,打包不报错,但是组件会报错
image

@BenzLeung
Copy link
Owner

@retwert 你这个报错不像是本项目的代码……

@retwert
Copy link

retwert commented Jun 3, 2019

@BenzLeung 这个是本地通过localhost访问时,会这样报错。我已经试过打包编译之后是可以用的,没有上面的错误。上面的三个“slice”错误就是因为我的语音文件有三个,所以会有三个错误信息。

@BenzLeung
Copy link
Owner

@retwert 你的问题实际上是 #17 的问题。已经尝试修复于 v1.0.17。

P.S. 以后这种与标题无关的问题建议开一个新的 issue。

@menglu628
Copy link

我的webpack是3.12.0,aot也是报错了,如果更改压缩方式可能成本较大。对于楼上所说的升级为uglifyjs-webpack-plugin,目前平台里两个都有。加入 babel 的 include的方案也尝试过了,还是没有成功,或者是否可以贴出实际解决方案的代码。

@BenzLeung
Copy link
Owner

@menglu628 或者试试把 uglifyjs-webpack-plugin 直接替换成 terser-webpack-plugin

@DavidJone
Copy link

请问cocos creator打包web mobile 报错:Build Failed: GulpUglifyError: unable to minify JavaScript!该如何处理?把uglifyjs改成uglifyjs-webpack-plugin和terser-webpack-plugin都尝试过了,无效

@BenzLeung
Copy link
Owner

@DavidJone cocos用的不是webpack,而是gulp。你须把uglifyjs换成terser并寻找terser对应的gulp解决方案。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants