ASP.NET Core MVC webpackを使用してimportしたいのですが、

こちらのサイトのこの記事を読んでまして、typescriptでなく、javascriptを使っているのですが、

ASP.NET Core で webpack を使う
https://www.umayadia.com/Note/Note036ASPNETCoreWebpack.htm


npx webpackは問題なく通るのですが、

importを書いても
Uncaught SyntaxError: Cannot use import statement outside a module というエラー　が出てしまい、

共通ファイルに　<script src="~/dist/bundle.js" type="module"></script>　と記述しても、同じエラーが出てしまい、解決できませんでした。

ASP.NET Core MVCですが、importができない原因はどんなことが考えられるでしょうか？

どなたかもしわかれば教えて下さい。


- webpack.config.js ----------------------------------------
const path = require("path");
const webpack = require("webpack");

module.exports = {
    entry: path.join(__dirname, "wwwroot", "source", "site.js"),
    output: {
        path: path.join(__dirname, "wwwroot", "dist"),
        filename: "bundle.js"
    },
    devtool: "source-map",
    mode: "development",
    resolve: {
        extensions: [".js", ".vue"],
        alias: {
            "vue$": "vue/dist/vue.global.js",
            "ag-grid-community$": "ag-grid-community/dist/ag-grid-community.js",
            "axios$": "axios/dist/axios.js",
            "chart.js$": "chart.js/dist/chart.js",
            "file-saver$": "file-saver/dist/FileSaver.js",
            "luxon$": "luxon/src/luxon.js"
            // Bootstrap5はcss中の$でエラーしたのでコメントアウトしてます
        },
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                exclude: /node_modules/,
                use: [ "style-loader", "css-loader" ]
            }
        ],
    }
}
----------------------------------------

- index.js(importを実行したファイル) ----------------------------------------
import { createApp } from "vue"

const app = createApp({

});

app.mount("#app");
----------------------------------------