给编译加点声音

前言##

最怕空气突然安静,最怕编译没有提示.
对于非多屏用户,常常都是按下保存键,切回网页,,等个几秒还没好,再切回去,心累.
现在你可以给你的编译加上成功或者失败的提示音了.

这里可以直接npm run dev感受一下 一个有声音的demo

实现##

其实就是在webpack编译事件多加个插件的事,在这里我用了百度的TTS的API,你也可以直接去download你喜欢的提示音放进来
function AnnouncerPlugin(options) { // customize. } AnnouncerPlugin.prototype.apply = (compiler) => { compiler.plugin('done', () => { getTTS({text:'陈皮尔你是最胖的',spd:6,lan:'zh'},function(f){ var stream = fs.createReadStream(f) var decoder = new lame.Decoder() stream.pipe(decoder).on('format', function(format) { var speaker = new Speaker(format) this.pipe(speaker) }) }) }) } module.exports = AnnouncerPlugin;

然后勒,把他加进webpack.config里吧,记得是dev里的...production你会被人打死
module.exports = { /* other configuration */ plugins: [ /* other configuration */ new WebpackAnnouncerPlugin() ] }

结尾##

百度的TTS粤语听着贼蠢...不过人工合成的也就那样吧
其他没啥建议的,想戒掉什么铃声就把他换上去吧

--Todo
1.未抽离,用起来还有点麻烦
2.win下tts的node模块实现

参考##

1. Webpack tip.
2. 百度TTS.