从webpack初始化,到配置babel环境

一、新建项目文件夹,在文件夹打开终端运行npm init,一直回车
二、安装babel所需要的包

npm install --save-dev @babel/core @babel/cli @babel/preset-env
npm install --save @babel/polyfill

三、根目录下新建babel.config.js,填入:

const presets = [
  [
    "@babel/env",
    {
      targets: {
        edge: "17",
        firefox: "60",
        chrome: "67",
        safari: "11.1",
      },
      useBuiltIns: "usage",
    },
  ],
];

module.exports = { presets };

四、根目录下新建webpack.config.js,填入:

const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  mode: 'development'
};

五、执行,安装webpack,根据提示安装webpack-cli

npm install webpack --save-dev 

六、修改packge.json,script填入

 "build": "webpack"

七、命令行运行,npm run build

你可能感兴趣的:(javascript,es6,babel,webpack)