Как подключить еще один файл .js к проекту, собранному на webpack?
Есть вот такой webpack.config.js. На странице index.pug у меня подключен script(src="src/index.js"), через который я обрабатываю файлы с расширением .scss. Как мне подключить к проекту еще один файл с расширением .js, допустим, script.js, который будет лежать в папке js, в котором у меня, например, будет прописан addEventListener для кнопки? Если под script(src="src/index.js") написать script(src="src/js/script.js"), то файл не подключается.
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
let mode = "development";
if (process.env.NODE_ENV === "production") {
mode = "production";
}
console.log(mode + " mode");
module.exports = {
mode: mode,
entry: {
scripts: "./src/index.js",
},
output: {
filename: "[name].[contenthash].js",
assetModuleFilename: "assets/[hash][ext][query]",
clean: true
},
devtool: "source-map",
optimization: {
splitChunks: {
chunks: "all",
},
},
plugins: [
new MiniCssExtractPlugin({
filename: "[name].[contenthash].css"
}),
new HtmlWebpackPlugin({
template: "./src/index.pug"
})],
module: {
rules: [
{
test: /\.html$/i,
loader: "html-loader",
},
{
test: /\.(sa|sc|c)ss$/,
use: [
(mode === "development") ? "style-loader" : MiniCssExtractPlugin.loader,
"css-loader",
{
loader: "postcss-loader",
options: {
postcssOptions: {
plugins: [
[
"postcss-preset-env",
{
// Options
},
],
],
},
},
},
"sass-loader",
],
},
{
test: /\.(png|svg|jpg|jpeg|gif)$/i,
type: "asset/resource",
},
{
test: /\.(woff|woff2|eot|ttf|otf)$/i,
type: "asset/resource"
},
{
test: /\.pug$/,
loader: "pug-loader",
exclude: /(node_modules|bower_components)/,
},
{
test: /\.n?js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
options: {
presets: ["@babel/preset-env"]
}
}
}
]
},
}