A
A
Alexey2021-10-01 14:11:30
webpack
Alexey, 2021-10-01 14:11:30

Why is Webpack exporting the entire js file?

Settings

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const TerserPlugin = require("terser-webpack-plugin");

module.exports = {
  mode: 'production',
  entry: {
    'main': './src/main/main.js',
    'page2': './src/main/second.js'
  },
  output: {
    path: path.resolve(__dirname, 'public'),
    publicPath: '/public/',
    filename: './[name].js',
  },
  optimization: {
    usedExports: true,
    minimize: true,
    minimizer: [new TerserPlugin()],
  },
  plugins: [
    new HtmlWebpackPlugin({
      inject: false,
      chunks: ['main'],
      filename: "index.html",
      template: 'index.html',
    }),
    new HtmlWebpackPlugin({
      inject: false,
      chunks: ['page2'],
      filename: 'pages/second.html',
      template: 'pages/second.html',
    }),
    new CleanWebpackPlugin(),
  ],
  module: {
    rules: [
      {
        test: /\.(jpg|png|jpe?g|gif)$/i,
        loader: 'file-loader',
        options: {
          name: '[path][name].[ext]',
          // publicPath: 'file:///android_asset/Game/',
        },
      },
      {
        type: 'javascript/auto',
        test: /\.(json)/,
        exclude: /(node_modules|bower_components)/,
        loader: 'file-loader',
        options: {
          name: '[path][name].[ext]',
          // publicPath: 'file:///android_asset/Game/',
        },
      },
    ],
  },
  performance: {
    maxEntrypointSize: 1024000,
    maxAssetSize: 1024000
  },
  devServer: {
    publicPath: '/public/',

    inline:true,
    stats:"errors-only",

    compress: true,
    port: 9000,
    hot: true,
    open: true,
  },
}


json
"scripts": {
    "build": "webpack --config webpack.config.js",
    "start": "webpack-dev-server --mode development",
    "format": "prettier --write '**/*.js'"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "three": "^0.115.0"
  },
  "devDependencies": {
    "clean-webpack-plugin": "^4.0.0",
    "file-loader": "^6.2.0",
    "html-webpack-plugin": "^4.5.2",
    "prettier": "^2.0.4",
    "terser-webpack-plugin": "^4.2.3",
    "webpack": "^4.42.1",
    "webpack-cli": "^3.3.11",
    "webpack-dev-server": "^3.11.0"
  }



file_1
import test from './test.js';
test();


file_2
export default function test() {
  console.log('hi from test');
}
function run() {
  return 5;
}
console.log(run());

Why is "run()" called additionally when working in file_1, although only "test()" should be called?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
S
Sergey delphinpro, 2021-10-01
@delphinpro

Because when you import the files is executed.
In this file there is a call to the run function (in the console log)
Here it is being executed.
If you remove console.log, it won't run.
quantum bullshit comes to mind: the fact of observation changes the state =)

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question