web-dev-qa-db-ja.com

React縮小と言ったReactそれが開発モードであってもエラー

私はbrowserifyとbabelを使用して、スクリプトのトランスパイルとバンドルを行っています。問題は、React 16を使用している場合です。この場合、次のエラーメッセージが表示されます。

捕捉されなかったエラー：縮小Reactエラー＃200;訪問 http://facebook.github.io/react/docs/error-decoder.html?invariant=2 for完全なメッセージを表示するか、完全なエラーと追加の役立つ警告については、縮小されていない開発環境を使用してください。

意味はわかっていますが、私はすでにプロダクションではなく開発モードにいます。

// gulpfile.js
const isProduction = config.environment === 'production';

if(isProduction) {
    process.env.NODE_ENV = 'production';
}
else {
    process.env.NODE_ENV = 'development';
}

console.log(process.env.NODE_ENV);    // it saids: development

function buildJs() {
    let bopts = {
        paths: [
            `${SRC_DIR}/js`,
            `${SRC_DIR}/scss`
        ],
        debug: true
    };
    let opts = Object.assign({}, watchify.args, bopts);

    let b = watchify(persistify(opts))
    .add(`${SRC_DIR}/js/index.js`)
    .on('update', bundle)
    .on('log', gutil.log)
    .transform(babelify, { 
        presets: ["es2015", "react"]
    })
    .transform(scssify, {
        autoInject: true
    });

    function bundle() {
        let stream = b.bundle()
        .on('error', swallowError)
        .on('end', () => {
            browserSync.reload();
        })
        .on('error', swallowError)
        .pipe(source('bundle.js'));

        if(isProduction) {
            stream.pipe(streamify(uglify()));
        }

        return stream.pipe(gulp.dest(`${BUILD_DIR}/js`));
    }

    return bundle();
}

なぜこれが起こり、これを修正するのですか？

javascriptreactjsbrowserifytranspiler
8
modernator

私のエラーは私が注入しようとしていたことでしたbundle.jsルート要素のないテンプレート<div id="app"> </div>。したがって、それを必要とするテンプレートでbundle.jsとルート要素を移動し、残りは移動しませんでした。それで解決しました。

4
Deke

セットする

mode: 'development'

ルートのwebpack.config.js内。

0
Akhilesh