Bracketsのプラグインでminify化してくれないjavascriptの書き方
- 2019.04.24
- javascript
僕はエディタにBracketsを使用しており、javascriptを保存すると自動的に改行の削除などをしてminify化してくれるプラグインを入れています。
javascriptの記述方法によっては、そのプラグインで圧縮してくれまえん。(ES6以降の新しい書き方に対応していないようです。)
圧縮してくれない書き方を以下にまとめておきます。
const, let
const example = document.getElementById('example');
let example = 0;
変数・定数をを宣言するconst、letがあると圧縮できませんでした。
どちらも var を使って書いてあげれば良いでしょう。
var example = document.getElementById('example'); var example = 0;
アロー関数
const myFunction = () => { // 処理内容 }
関数を短く書くことのできるアロー関数も、圧縮してくれません。
function式で書きます。
var myFunction = function () { // 処理内容 }
classList.add()などに複数
element.classList.add('クラス名1', 'クラス名2');
htmlのクラスを扱う classList.add や classList.remove に、ES6だと複数していできます。
しかし、これもBrackestsのminifyプラグインではやってくれません。
element.classList.add('クラス名1'); element.classList.add('クラス名2');
2回に分けて記述すると良いでしょう。
テンプレートリテラル
let example ='テキスト'; console.log(`変数に${examaple}が入っています。`);
文字列の中に変数などを簡単に含ませることができる書き方です。
「“」で囲んで、変数は${}を使って書きます。
これも圧縮してくれません。
let example ='テキスト'; console.log('変数に' + examaple + 'が入っています。');
「”」シングルクォーテーション(もしくはダブルクォーテーション)と「+」記号を使って書くと良いでしょう。
*
便利な書き方がことごとく圧縮できませんね。
IE11でもうまく動いてくれません。
-
前の記事
css圧縮時にエラーになる書き方 2019.04.06
-
次の記事
アニメーションしながら選択肢を絞り込むソート機能 2019.05.06