从webpack初始化到配置babel环境

34次阅读

共计 601 个字符,预计需要花费 2 分钟才能阅读完成。

一、新建项目文件夹,在文件夹打开终端运行 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

正文完
 0