学習方法

メンター情報

料金

対応時間帯

返信スピード

学習方法

メンター情報

料金

対応時間帯

返信スピード

masaya01

ASP.NET Core MVC(C#、.NET5)、SQL Server、EntityFramework Core(ORM)、 jsライブラリ: Bootstap5、javascript(Vue.js3)、AG-Grid、Chart.js、axios、luxon を用いて、Web系の業務システム開発をしています。 システム経験少なく、失敗....
プロフィールをもっとみる

--

募集をシェアしてメンターを探そう
シェア

※ この募集は締め切られました。

プログラミング

asp.net core mvc(.NET5)での、webpackとjavascriptのimportの使い方

2021年10月1日
単発
予算
3,000円 〜
提案数
提案待ち
応募期限
終了

asp.net core mvc(.NET5)での、webpackとjavascriptのimportの使い方を調べてます。

Google usで海外サイト等も調べましたが、答えとなるものが見つかりませんでした。

バンドルしたjsファイルのみ、importができるっぽいです。

やりたいことは、以下のwebpack.config.jsの中のjsとcssをASP.NET Core MVC内のjavascriptのmoduleとして、importで使用したいです。(Vue-Cliは使いません)

ただし、このままmoduleとして実行すると、jQueryもエラーするし、importがうまくいかないjsライブラリもあったし、BootstrapのCSSが遅延して実行されますので、その改善も必要です。

また、バンドルしたjsファイル以外でもimportができるのかを知りたいです。

-- webpack.config.js --

const path = require("path");
const webpack = require("webpack");

module.exports = {
entry: {
main: "./src/js/app.js"
},
output: {
path: path.resolve(__dirname, "..", "wwwroot", "dist"),
filename: "app.bundle.js"
},
devtool: "source-map",
mode: "development",
resolve: {
extensions: [".js", ".vue"],
alias: {
"vue$": "vue/dist/vue.global.js",
"ag-grid-enterprise$": "ag-grid-enterprise/dist/ag-grid-enterprise.js",
"axios$": "axios/dist/axios.js",
"bootstrap$": "bootstrap/dist/js/bootstrap.js",
//"bootstrap-css$": "bootstrap/dist/css/bootstrap.min.css",
"chart.js$": "chart.js/dist/chart.js",
"file-saver$": "file-saver/dist/FileSaver.js",
“jquery$": "jquery/dist/jquery.js",
"jquery-validation$": "jquery-validation/dist/jquery.validate.js",
"jquery-validation-unobtrusive$": "jquery-validation-unobtrusive/dist/jquery.validate.unobtrusive.js",
"luxon$": "luxon/src/luxon.js",
//"popperjs$": "@popperjs/core"
},
},
module: {
rules: [
{
test: /\.css$/,
use: [ "style-loader", "css-loader" ]
},
{
test: /\.js?$/,
use: {
loader: "babel-loader",
options: {
presets: ["@babel/preset-env"]
}
}
},
],
}
}
--

masaya01

プロフィール

ASP.NET Core MVC(C#、.NET5)、SQL Server、EntityFramework Core(ORM)、

jsライブラリ: Bootstap5、javascript(Vue.js3)、AG-Grid、Chart.js、axios、luxon

を用いて、Web系の業務システム開発をしています。

システム経験少なく、失敗しない方法を探していたので、システム開発にクリーンアーキテクチャ(オニオンアーキテクチャ)とドメイン駆動設計を導入してます。
プログラムは手段の1つだけど、きれいなコーディングを心掛けています。

--

募集をシェアしてメンターを探そう
シェア