여러 진입 점을 사용하여 babel polyfill을 포함하는 가장 좋은 방법은 무엇입니까?

여러 진입 점을 사용하여 babel polyfill을 포함하는 가장 좋은 방법은 무엇입니까?

---

여러 진입 점을 사용하는 웹팩 구성을 사용하고 있습니다.

var fs = require('fs');
var webpack = require('webpack');
var commonsPlugin = new webpack.optimize.CommonsChunkPlugin('common.[hash].js');

module.exports = {
    cache: true,
    entry: {
        main: './resources/assets/js/main.js',
        services: './resources/assets/js/services.js'
    },
    output: {
        path: './public/assets/web/js',
        filename: '[name].[hash].js',
        publicPath: '/assets/web/js/',
        chunkFilename: '[id].[chunkhash].js'
    },
    resolve: {
        modulesDirectories: ['node_modules', 'web_modules', 'modules']
    },
    module: {
        loaders: [{
            test: /\.js$/,
            exclude: [/node_modules/, /web_modules/],
            loader: 'babel-loader',
            query: {
                stage: 0
            }
        }]
    },
    plugins: [commonsPlugin,
        new webpack.ProvidePlugin({
            jQuery: 'jquery',
            $: 'jquery',
            'window.jQuery': 'jquery'
        }),
        function() {
            this.plugin('done', function(stats) {
                fs.writeFile('./cache.json', JSON.stringify({
                    hash: stats.hash
                }));
            });
        }
    ]
};

내 webpack 구성에 babel polyfill 을 포함시키는 방법이 있습니까? 또는 설정에 포함하는 가장 좋은 방법은 무엇입니까?

모든 모듈에 필수로 포함해야합니까?

미리 감사드립니다!

---

가장 쉬운 방법은

main: './resources/assets/js/main.js',
services: './resources/assets/js/services.js'

되려고

main: ['babel-polyfill', './resources/assets/js/main.js'],
services: ['./resources/assets/js/services.js']

그래서 polyfill이 파일에 대해 알 필요없이 각 진입 점의 일부로로드되고 실행됩니다.

이는 main및 둘 다 services동일한 페이지에로드 되었다고 가정합니다 . 두 개의 개별 페이지 인 경우 babel-polyfill두 배열 모두에 항목이 필요합니다.

노트

위의 내용 바벨 6 바벨 5. 적용, 당신은 것 npm install --save babel-polyfill하고 사용 babel-polyfill대신에 babel/polyfill.

---

An alternative for development (perhaps not the best setup for production) would be to have babel-polyfill in its own module:

entry: {
    'babel-polyfill': ['babel-polyfill'],
    main: './resources/assets/js/main.js',
    services: './resources/assets/js/services.js'
}

Background: I tried the suggestion in the answer above and was still getting an error: "Only one instance of babel-polyfill is allowed". I'm using webpack 2 so maybe that's a factor. The above solution is fine for my purposes since I'm writing a reusable library to be included in larger apps, and just want a separate demo bundle in the library repo for testing purposes. But for a full app, it might not be a good idea to require an extra HTTP request to load the polyfill in production unless you're using HTTP/2.

참고URL : https://stackoverflow.com/questions/33380063/what-is-the-best-way-to-include-babel-polyfill-using-multiple-entry-points