Asciidoctor Maven Pluginを使って良い感じにPlantUML図をHTMLファイルに埋め込む
この記事のゴール
・Asciidoctor Maven Pluginを使って良い感じにPlantUML図をHTMLファイルに埋め込む。
作業の流れ
- プロジェクトフォルダ作成(所要時間:10秒)
- pom.xmlの設定(所要時間:30秒)
- adoc形式ファイル作成(所要時間:30秒)
- ビルド【adoc形式ファイル → HTMLファイルに変換】(所要時間:30秒)
作業1:プロジェクトフォルダ作成
・フォルダ「asciidoc-practice」作成
作業2:pom.xmlの設定
・asciidoc-practiceフォルダ配下にpom.xml作成
・下記をpom.xmlにコピペ
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.asciidoc.practice</groupId>
<artifactId>asciidoc-practice</artifactId>
<packaging>jar</packaging>
<version>1.0-SNAPSHOT</version>
<name>asciidoc-practice</name>
<url>http://maven.apache.org</url>
<build>
<plugins>
<plugin>
<groupId>org.asciidoctor</groupId>
<artifactId>asciidoctor-maven-plugin</artifactId>
<version>2.1.0</version>
<!-- process-asciidocゴールはどのフェーズにも紐づいてないので、
generate-resourcesフェーズに紐づけて、ビルド時にこのフェーズを指定して実行する -->
<executions>
<execution>
<id>asciidoc-to-html</id>
<phase>generate-resources</phase>
<goals>
<goal>process-asciidoc</goal>
</goals>
</execution>
</executions>
<!-- PlantUML図をadoc形式ファイル内に埋め込むための依存追加 -->
<dependencies>
<dependency>
<groupId>org.asciidoctor</groupId>
<artifactId>asciidoctorj-diagram</artifactId>
<version>2.1.2</version>
</dependency>
</dependencies>
<configuration>
<!-- PlantUMLのやつ -->
<requires>
<require>asciidoctor-diagram</require>
</requires>
</configuration>
</plugin>
</plugins>
</build>
</project>
作業3:adoc形式ファイル作成
・下記フォルダ構成でindex.adocを作成する
asciidoc-practice/src/docs/asciidoc/index.adoc
・index.adocに下記をコピペする(私が個人学習用に作成したやつ)
[plantuml]
----
left to right direction
skinparam linetype ortho
actor User
rectangle AWS {
rectangle Amplify {
[Frontend] as front
}
rectangle VPC1 {
rectangle ECS {
[Backend] as back
}
}
rectangle VPC2 {
database RDS as db {
}
[踏み台] as js
}
}
actor Developer
User --> front : HTTPS
User --> back : HTTPS
back --> db : JDBC
Developer --> js : SSH PortForward
----
作業4:ビルド(adoc形式ファイル → HTMLファイルに変換)
・asciidoc-practice配下で下記コマンド実行
mvn generate-resources
・asciidoc-practice/target/generated-docs配下に「index.html」が作成されていることを確認
・下記のような図が表示されていることを確認
参考
Author And Source
この問題について(Asciidoctor Maven Pluginを使って良い感じにPlantUML図をHTMLファイルに埋め込む), 我々は、より多くの情報をここで見つけました https://qiita.com/crml1206/items/e738b4a8cc3abf35ec8f著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .