カテゴリ
以前の記事
2024年 03月 2024年 01月 2023年 12月 2023年 08月 2023年 06月 2023年 05月 2023年 03月 2022年 08月 2021年 11月 2021年 10月 2021年 02月 2020年 12月 2020年 11月 2020年 10月 2020年 06月 2020年 05月 2018年 02月 2017年 12月 2017年 11月 2017年 09月 2017年 08月 2016年 07月 2016年 06月 2016年 05月 2015年 12月 2015年 10月 2015年 09月 2015年 07月 2015年 04月 2015年 03月 2015年 02月 2014年 07月 2012年 03月 2012年 02月 2011年 11月 2011年 06月 2011年 05月 2011年 04月 2011年 02月 2010年 11月 2010年 09月 2010年 06月 2009年 04月 2009年 03月 2009年 02月 2008年 12月 2008年 02月 2007年 10月 2007年 08月 2006年 04月 2006年 03月 2005年 08月 2005年 06月 2005年 04月 2005年 03月 2005年 01月 2004年 10月 2004年 07月 2004年 06月 2004年 05月 2004年 04月 2004年 03月 2004年 02月 フォロー中のブログ
その他のジャンル
ファン
記事ランキング
ブログジャンル
画像一覧
|
その1から続き できました というわけで以下build.gradle.kts plugins { gradle war(あるいは ./gradlew war) でwarファイルまで作ってくれます。 あ、ライセンスはMITでどうぞ Copyright(C) 2024 rx21.exblog.jp (追記) 環境、設定値によってはVue3のディレクトリにあるvue.config.tsとかvite.config.tsといったファイルの修正が必要
#
by rx21
| 2024-03-23 16:08
ネットを探してみたがあんまりやっている人がいない&そもそもGradleがよくわかってない というわけでChatGPTさん ※もっと良い方法があるかもなのであくまで参考程度に 環境 2024-03時点の最新・・・というわけではないので将来的に動かなくなるかも Gradle: 7.2 NodeJS: v18.17.1 NPM: 10.2.5 Gradleのプロジェクトを作成 最近のバージョン?からmulti-projectなる形式がデフォルトになったみたいでややこしくなっているがとりあえず作成する。type of projectで 1: basicを選ぶとサブプロジェクトが作られないのでそっちの方がよいかも 空のディレクトリを作成~移動してから"gradle init"を実行、ウィザードに従い進める。 DSLはKotlinを選択 build.gradle.ktsを作成 // 最低限以下があればとおる(はず) plugins { java war id("com.github.node-gradle.node") version "7.0.2" // 2024-03時点 } repositories { mavenCentral() } dependencies { // WebAPI関連のライブラリを入れる(省略、あとでどっかに書くかも) } // nodeプラグインの設定 node { // とりあえず現時点のバージョンに合わせてみた version.set("18.17.1") npmVersion.set("10.2.5") download.set(true) } // ChatGPTとのやり取りの成果 tasks { val npmInstallTask by creating { group = "build" description = "Run npm install" doLast { exec { workingDir = file("$projectDir/src/main/vue") commandLine = listOf("npm", "install") } } } val cleanVueDist by creating { group = "build" description = "Clean Vue dist directory" doLast { val distDir = file("$projectDir/src/main/vue/dist") distDir.deleteRecursively() } } val npmRunBuild by registering { dependsOn(npmInstallTask, cleanVueDist) group = "build" description = "Run npm build script" doLast { exec { workingDir = file("$projectDir/src/main/vue") commandLine = listOf("npm", "run", "build") } } } val cleanAssets by creating { group = "build" description = "Clean assets directory" doLast { val assetsDir = file("$projectDir/src/main/webapp/assets") assetsDir.deleteRecursively() } } val copyToFrontendResources by creating { dependsOn(npmRunBuild, cleanAssets) group = "build" description = "Copy built frontend resources to src/main/webapp" doLast { val sourceDir = file("$projectDir/src/main/vue/dist") val targetDir = file("$projectDir/src/main/webapp") sourceDir.copyRecursively(targetDir, overwrite = true) } } val warTask = named<War>("war") warTask.configure { dependsOn(copyToFrontendResources) } } // ↓はJavaのバージョン指定だがVueのビルドとは関係ない java { toolchain { languageVersion.set(JavaLanguageVersion.of(11)) } } Vueのプロジェクトを作成 src/main で "npm create vue@latest" を実行 こんな感じ、WEB-INF/web.xmlは必要に応じて適宜作成 vue/vite.config.tsを修正 このままだと出力されるindex.htmlが絶対パス"/assets/~"で出力されてしまうので修正する。 "http://hogehoge.jp"といったように直下に出力するのであれば不要 "http://hogehoge.jp/hogeApp"みたいな名前(content-path)とする場合設定が必要になるがもしかしたらもっと適切な方法があるかも・・・ base: './', の行を追加する。 gradle warを実行 上手くいったらログがこんな感じででる。 webapp直下に出力されたindex.htmlでsrcipt/linkのパスが相対パス(先頭に"./"が追加されている)になっていることを確認。 プロジェクトのbuild/libs以下にwarファイルが出力される。 拡張子をzipに変えて展開するとVue関連のファイルもwebapp以下に入っているはず・・・。 ・・・ここまでやって気づいたが npmコマンドが node {} で指定したバージョンではなくローカルていうかPathがとっている場所のもので実行されている。 そもそも上記の書き方ならnodeのプラグイン不要だ・・・。 「その2」でやります。 ↓ #
by rx21
| 2024-03-17 15:16
"sudo apt install gradle" だと、古いバージョンが入ってしまったのでメモ ※多分一番簡単 (2024-03-07 追記)下を実行する前に zip unzip curl を"apt install"でインストールしておく。
#
by rx21
| 2024-01-23 08:42
| Program
https://rx21.exblog.jp/240379561/ の設定ファイルをGradle(build.gradle.kts)にしてみた。 あと、バージョンをちょっと上げた (javaxのままいつになったらjakartaに移行できるのだろうか・・・) // Servlet + JSF(おまけ) #
by rx21
| 2024-01-08 18:01
| Program
Maven/Gradleで「org.webjars.npm/」のパッケージを導入すると contentPath/webjars/以下に格納される 似たような記事あった https://rx21.exblog.jp/22852053/ PS <h:outputScript>について JSF2.3時点だとES6のmoduleに対応していないので<script>タグを使って何とかする必要があるらしい #
by rx21
| 2024-01-08 12:57
| Program
|
ファン申請 |
||