Babel 设置错误：“./src/js/index.js 中的错误”

Question

更新：我解决了这个问题。查看答案。

目标：设置 Babel。

问题：我在使用 webpack 创建 bundle.js 文件时遇到错误，使用命令：npm run dev。 screenshot 1screenshot 2

./src/js/index.js

import num from "./test";
const x = 45;
console.log(`I imported ${num} from test.js - ${x}`);

webpack.config.js：

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
    entry: ["babel-polyfill", "./src/js/index.js"],
    output: {
        path: path.resolve(__dirname, "dist"),
    filename: "js/bundle.js"
    },
    devServer: {
    contentBase: "./dist"
    },
    plugins: [
    new HtmlWebpackPlugin({
        filename: "index.html",
        template: "./src/index.html"
    })
    ],
    module: {
    rules: [ 
        {
        test: /\.js$/, 
        exclude: /node_modules/, 
        use: { 
            loader: "babel-loader"
                }
        }
        ]
    }
};

Answer 1

我修复了错误。原来我需要安装新的 Babel 包。

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

将 webpack.config.js 中的 entry 替换为：

entry: ["@babel/polyfill", "./src/js/index.js"],

将 .babelrc 中的 presets 替换为：

{
  "presets": ["@babel/env"]
}

Answer 2

您好像错过了babel-core

我想跑步：

npm install --save-dev babel-core

应该修复它