Outlook addin JS- NPM run build missing JS files - npm

Question

I am working on creating an Outlook addin project following the below tutorial:-
https://learn.microsoft.com/en-us/office/dev/add-ins/quickstarts/outlook-quickstart?tabs=yeomangenerator
During development i added some extra JavaScript files(like helper.js, settings.js) which contains some common and helper functions which are work fine while running locally,
Now when i run "npm run build" command for generating a published version of the project to be deployed on server these files are missing and thus published project is not working due to missing functions.
Below is my project.
project structure
missing helper and setting folder
below is my webpack.config.js boiler plate code
module.exports = async (env, options) => {
const dev = options.mode === "development";
const buildType = dev ? "dev" : "prod";
const config = {
devtool: "source-map",
entry: {
polyfill: ["core-js/stable", "regenerator-runtime/runtime"],
taskpane: "./src/taskpane/taskpane.js",
commands: "./src/commands/commands.js",
landing: "./src/landing/landing.js"
},
resolve: {
extensions: [".html", ".js"]
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
options: {
presets: ["#babel/preset-env"]
}
}
},
{
test: /\.html$/,
exclude: /node_modules/,
use: "html-loader"
},
{
test: /\.(png|jpg|jpeg|gif)$/,
loader: "file-loader",
options: {
name: '[path][name].[ext]',
}
}
]
},
plugins: [
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
filename: "taskpane.html",
template: "./src/taskpane/taskpane.html",
chunks: ["polyfill", "taskpane"]
}),
new CopyWebpackPlugin({
patterns: [
{
to: "taskpane.css",
from: "./src/taskpane/taskpane.css"
},
{
to: "[name]." + buildType + ".[ext]",
from: "manifest*.xml",
transform(content) {
if (dev) {
return content;
} else {
return content.toString().replace(new RegExp(urlDev, "g"), urlProd);
}
}
}
]}),
new HtmlWebpackPlugin({
filename: "commands.html",
template: "./src/commands/commands.html",
chunks: ["polyfill", "commands"]
}),
new HtmlWebpackPlugin({
filename: "landing.html",
template: "./src/landing/landing.html",
chunks: ["polyfill", "dialog"]
})
],
devServer: {
headers: {
"Access-Control-Allow-Origin": "*"
},
https: (options.https !== undefined) ? options.https : await devCerts.getHttpsServerOptions(),
port: process.env.npm_package_config_dev_server_port || 3000
}
};
return config;
};
Could you please help

Answer 1

Finally found the solution, We need to include the custom/helper js files by
marking the functions as export & making them require on the main files that needs &
then use the functions exported and
once we run "npm run build" function is available as the part of main file which made it required
below is the example of the same
//custom or helper file in a subfodler
sample.js
export function sampleFunc() {
//some codeenter code here
}
taskpane.js // main file where we need to use
const samJs = require("./../helpers/sample"); // without extesion
//Call the function
var data = samJs.sampleFunc