我如何设置Babel，然后在命令提示符下单击“ npm run dev”，而没有收到“ ./src/js/index.js中的错误？”

问题描述 投票：0回答：1

[我想做的是将babel / polyfill与index.js文件捆绑在一起（使用webpack）。设置好之后，我在命令提示符下运行了“ npm run dev”，但是没有用。显示的第一行错误是“ ./src/js/index.js中的错误”。正在使用javascript（ES6）。

这是一个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"
                }
            }
        ]
    }
};

这是一个.babelrc文件。

{
    "presets": [
        ["@babel/env", {
            "targets": {
                "browsers": [
                    "last 5 versions",
                    "ie >= 8"
                ]
            }
        }]
    ]
}

这是一个package.json文件。

{
  "name": "forkify",
  "version": "1.0.0",
  "description": "forkify project",
  "main": "index.js",
  "scripts": {
    "dev": "webpack --mode development",
    "build": "webpack --mode production",
    "start": "webpack-dev-server --mode development --open"
  },
  "author": "AGO McAGO",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.10.1",
    "babel-core": "^6.26.3",
    "babel-loader": "^8.1.0",
    "babel-preset-env": "^1.7.0",
    "html-webpack-plugin": "^4.3.0",
    "webpack": "^4.43.0",
    "webpack-cli": "^3.3.11",
    "webpack-dev-server": "^3.11.0"
  },
  "dependencies": {
    "babel-polyfill": "^6.26.0"
  }
}

这是整个错误（在命令提示符下，Windows10）。

> webpack --mode development

Hash: 54008735e66cf4b55f83
Version: webpack 4.43.0
Time: 20104ms
Built at: 05/31/2020 18:20:37
       Asset      Size  Chunks             Chunk Names
  index.html  17.6 KiB          [emitted]
js/bundle.js  9.49 KiB    main  [emitted]  main
Entrypoint main = js/bundle.js
[0] multi ./src/js/index.js 28 bytes {main} [built]
[./src/js/index.js] 4.7 KiB {main} [built] [failed] [1 error]

ERROR in ./src/js/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\src\js\index.js: Cannot read property 'bindings' of null
    at Scope.moveBindingTo (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\scope\index.js:933:13)
    at BlockScoping.updateScopeInfo (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\babel-plugin-transform-es2015-block-scoping\lib\index.js:364:17)
    at BlockScoping.run (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\babel-plugin-transform-es2015-block-scoping\lib\index.js:330:12)
    at PluginPass.BlockStatementSwitchStatementProgram (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\babel-plugin-transform-es2015-block-scoping\lib\index.js:70:24)
    at newFn (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\visitors.js:179:21)
    at NodePath._call (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\path\context.js:55:20)
    at NodePath.call (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\path\context.js:42:17)
    at NodePath.visit (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\path\context.js:90:31)
    at TraversalContext.visitQueue (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\context.js:112:16)
    at TraversalContext.visitSingle (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\context.js:84:19)
    at TraversalContext.visit (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\context.js:140:19)
    at Function.traverse.node (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\index.js:84:17)
    at traverse (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\traverse\lib\index.js:66:12)
    at transformFile (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\core\lib\transformation\index.js:107:29)
    at transformFile.next (<anonymous>)
    at run (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\core\lib\transformation\index.js:35:12)
    at run.next (<anonymous>)
    at Function.transform (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\core\lib\transform.js:27:41)
    at transform.next (<anonymous>)
    at step (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\gensync\index.js:254:32)
    at C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\gensync\index.js:266:13
    at async.call.result.err.err (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\gensync\index.js:216:11)
    at C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\gensync\index.js:184:28
    at C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\@babel\core\lib\gensync-utils\async.js:72:7
    at C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\gensync\index.js:108:33
    at step (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\gensync\index.js:280:14)
    at C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\gensync\index.js:266:13
    at async.call.result.err.err (C:\Users\asus1\Documents\AGO McAGO\1.pracareas\7.5Javascript\Jonas Schmedtmann\46.Forkify\node_modules\gensync\index.js:216:11)
 @ multi ./src/js/index.js main[0]
Child HtmlWebpackCompiler:
     1 asset
    Entrypoint HtmlWebpackPlugin_0 = __child-HtmlWebpackPlugin_0
    [./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html] 18.3 KiB {HtmlWebpackPlugin_0} [built]
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! [email protected] dev: `webpack --mode development`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\asus1\AppData\Roaming\npm-cache\_logs\2020-05-31T17_20_37_349Z-debug.log
javascript npm webpack babel babel-polyfill
1个回答
0
投票

为什么@babel/polyfill在您的entry数组中？我不认为它属于那里。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.