/ src/app.js
let a = 123
let test = value => {
console.log(value * 2)
}
test(a)
I use console.log () here. The bundle.js packaged with webpack looks like this:
([function (e, t, n) {
"use strict";
! function (e) {
console.log(2 * e)
}(2)
}]); I changed console.log () in app.js to return . After packaging, the bundle.js is finally empty and does not include the code in my app.js. Why?
here is my configuration:
const webpack = require("webpack")
const path = require("path")
const HtmlWebpackPlugin = require("html-webpack-plugin")
const config = {
entry: "./src/app.js",
output: {
path: path.resolve(__dirname, "dist"),
filename: "bundle.js",
},
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules)/,
use: {
loader: "babel-loader",
options: {
presets: ["env"]
}
}
}
]
},
plugins: [
new HtmlWebpackPlugin({
template: "./src/index.html"
})
]
}
module.exports = configpackage.json:
{
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "7",
"babel-preset-env": "^1.7.0",
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.17.1",
"webpack-cli": "^3.1.0"
}
}
using babel-core is supposed to convert the ES6 code into ES3 and then package it into bundle.js. Why didn"t I get such a result here?
the bundle.js result I want should be like this:
var a = 123
function test(value){
return value * 2
}
test(a)
is my posture wrong or is there something wrong with the configuration? You didn"t make a mistake when you started. Solve the problem?
