w* Ⅰ. はじめに
タイトルの通り「Laravel MixのJavaScriptを難読化する方法」です。
javascript-obfuscator の webpackプラグインである webpack-obfuscator を利用した方法をこの記事で紹介します。
Ⅱ. やり方
1. webpack-obfuscator をインストールする
npm install --save-dev webpack-obfuscator@2.6.0
2. webpack.mix.js を編集する
let mix = require('laravel-mix') // 以下を追加 let JavaScriptObfuscator = require('webpack-obfuscator') let config = {} if (mix.inProduction()) { config.plugins = [ new JavaScriptObfuscator({ stringArray: true, stringArrayEncoding: [ 'rc4' ], stringArrayThreshold: 1, transformObjectKeys: true, // debugProtection: true, // domainLock: [ '.example.com' ], // renameProperties: true // プロパティ名を変更する。利用は留意する必要がある }) ] } mix.webpackConfig(config) // ここまで mix.js('resources/assets/js/app.js', 'public/js') .sass('resources/assets/sass/app.scss', 'public/css').version()
3. ビルドする
npm run production
実行結果
Ⅲ. やり方2(uglify を無効にして難読化する方法)
webpack.mix.js
if (mix.inProduction()) { mix.options({ uglify: false }) config.plugins = [ new JavaScriptObfuscator({ rotateUnicodeArray: true, compact: true, }) ] }