babel 相继的问题处理以及hrml-webpack-plugin

babel的使用无需再讲了，请自行查看官网吧.

1.关于报错，要分清除是webpack打包错误还是你的js语法错误，webapck不会帮你解决语法问题

 

index.js 

let test=  function () {
    return new Promise((resolve)=>{
            resolve("你好")
    })
}
console.log(test());
const arr = [1,2,3,4].map(item => item * item)
const hasNumber = (num) => [4, 5, 6, 7, 8].includes(num)
console.log(arr)
console.log( hasNumber(2) )

webpack.config.js

const path = require('path');
const webpack = require('webpack');
/*自动生成html*/
const HtmlWebpackPlugin = require('html-webpack-plugin');
/*清理dist文件夹*/
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
module.exports = {
    mode: "development",
       entry: {
           index: './src/index.js',
           },
output: {
        filename: '[name].bundle.js',
        path: path.resolve(__dirname, 'dist'),
},
module: {
    rules: [
    {
        test: /\.m?js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
            loader: 'babel-loader',
            options: {
                "presets": [['@babel/preset-env',
                    {
                        "useBuiltIns":"usage",
                        "corejs":3
                    }

                ]
                    ]
            }
        }
    }
    ],
},

plugins: [
    /*在plugins引入CleanWebpackPlugin，不需要指定dist了*/
    new CleanWebpackPlugin(),
    new webpack.ProvidePlugin({
        join: ['lodash', 'join'],
    }),
    new HtmlWebpackPlugin({
        title: "Webpack App",
        filename: 'dist/admin.html'
    })
],
};