Cannot call other functions in the same Typescript file

Question

I'm importing function from a Typescript file:
import { myExportedFunction } from '../utils/myFile';

The myExportedFunction function calls a non-exported function in the same file:

const myNonExportedFunction = () => {
    ... code ...
}

export const myExportedFunction = () => {
    myNonExportedFunction();

    ... more code ...
}

When I run it, I get: Uncaught Reference error: 'myNonExportedFunction' is not defined. If I replace the function call with the code inside myNonExportedFunction, everything works.
Why am I getting this error? Context: this code is for a chrome plugin.

tsconfig:

{
  "compilerOptions": {
    "target": "es6",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "Node16",
    "moduleResolution": "Node16",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx"
  },
  "include": [
    "src"
  ]
}

webpack.config:

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyWebpackPlugin = require("copy-webpack-plugin");
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

module.exports = {
    entry: {
        index: [
            "regenerator-runtime/runtime.js",
            path.resolve(__dirname, "src", "Index.tsx"),
        ],
        background: path.resolve(__dirname, "src", "background.ts"),
        "content-scripts": path.resolve(__dirname, "src", "content-scripts.ts"),
        "ninjas-content-script": path.resolve(__dirname, "src", "ninjas-content-script.ts"),
    },
    output: {
        filename: "[name].js",
        path: path.resolve(__dirname, "dist"),
    },
    plugins: [
        new CopyWebpackPlugin({
            patterns: [{ from: "public" }],
        }),
        new HtmlWebpackPlugin({
            filename: "index.html",
            chunks: ["index"],
        }),
        new MiniCssExtractPlugin({
            filename: 'styles/[name].css',
        }),
    ],
    resolve: {
        extensions: [".tsx", ".ts", ".js"],
    },
    module: {
        rules: [
            {
                test: /\.tsx?$/,
                use: [
                    {
                        loader: "ts-loader",
                        options: {
                            compilerOptions: {noEmit: false},
                        },
                    },
                ],
                exclude: /node_modules/,
            },
            {
                test: /\.css$/,
                use: [MiniCssExtractPlugin.loader, "css-loader"],
            },
        ],
    },
};

Answer 1

Got it to work by wrapping all the functions in another function.

export function myWrapperFunction() {
    // previously 'myNonExportedFunction'
    function myHelperFunction() {
        ... code ...
    }

   // previously 'myExportedFunction'
   function myFunction() {
        myHelperFunction();
      
        ... more code ...
    }

    myFunction();
}

This works as I only have one exported function in the file. If you have more than one exported function and both need to use the non-exported function, then I think the non-exported function must be duplicated or where the myFunction is called, some logic has to decide to call a suitable method.