web-dev-qa-db-ja.com

本番配布ファイルのコード行をいくつか削除しますか？

BabelとWebpackを使用して、ES5からES6コードを生成しています。コーディング中に行う間違いを減らすために使用される検証がいくつかあります。

class Logger {
    /**
     * @param {LogModel} info
     *  {LogTypes} type
     *  {String} message
     *  {Date} date
     */
    static log(info) {
        if(info instanceof LogModel)
            throw new Error("not a instance of LogModel");

        notify(info);
    }
}

log関数で、引数がLogModelクラスのインスタンスであるかどうかを検証します。これは間違いを防ぐためだけです。 if条件が多すぎるとアプリケーションが遅くなるため、if条件が本番環境にあることは望ましくありません。 BabelおよびWebpackを使用した検証なしで、検証付きの開発リリースと本番リリースを生成することは可能ですか？

javascriptwebpackbabel
10
s1n7ax

assert パッケージを使用してコードを適用してから、 webpack-unassert-loader または webpack-strip-assert を使用してアサーションを削除できます。プロダクションコード。

var assert = require('assert').ok;

class Logger {
    /**
     * @param {LogModel} info
     *  {LogTypes} type
     *  {String} message
     *  {Date} date
     */
    static log(info) {
        assert(info instanceof LogModel, "Param must be an instance of LogModel");
        notify(info);
    }
}
5
rgthree

他の答えは時代遅れのようです。 webpack 4では、webpack設定でmode: 'production'を設定できます。

コードで、次のような開発モードを確認します。

if (process.env.NODE_ENV === 'development') {
    if(info instanceof LogModel)
        throw new Error("not a instance of LogModel");
}

Webpackがmode: 'production'でバンドルを作成すると、これらのif句内のすべてのコードがif句自体とともに、バンドルから自動的に削除されます。

定義プラグインを明示的に使用する必要はありません（「内部」でWebpackによって使用されます）。また、他の回答で言及されているwebpack-unassert-loaderやwebpack-strip-blockのようなものを使用する必要もありません。

私がこれを試すために作ったこの小さなデモリポジトリをチェックしてください： https://github.com/pahund/webpack-devprod-experiment

16
Patrick Hund

よりクリーンなオプションは、webpackの define-plugin を使用することです。

設定ファイル内：

new webpack.DefinePlugin({ __DEV: JSON.stringify(true) })

app.js：

if(__DEV){ console.log("logged only in dev env") }

__DEVの値は、コンパイル時にwebpackによって提供されます。

6
Arjun

webpack-strip-block は良い解決策です。コンパイル時に本番コードのコードブロックを削除します。

/* develblock:start */
/* develblock:end */

assertsに限定されず、prodに冗長なコードはありません。

5
s1n7ax