You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
image:{img-ci-status}[CI Status (GitLab CI), link={url-ci-pipelines}]
22
+
23
+
This project is an archetype that demonstrates how to produce a UI bundle for use in a documentation site generated with {url-antora}[Antora].
24
+
You can see a preview of the default UI at {url-preview}.
25
25
26
26
== Use the Default UI
27
27
@@ -46,44 +46,44 @@ A more comprehensive tutorial will be made available in the documentation.
46
46
47
47
To preview and bundle the default UI, you need the following software on your computer:
48
48
49
-
* {uri-git}[git] (command: `git`)
50
-
* {uri-node}[Node 8] (command: `node`)
51
-
* {uri-gulp}[Gulp CLI] (command: `gulp`)
52
-
* {uri-yarn}[Yarn] (command: `yarn`)
49
+
* {url-git}[git] (command: `git`)
50
+
* {url-node}[Node] (command: `node`)
51
+
* {url-gulp}[Gulp CLI] (command: `gulp`)
52
+
* {url-yarn}[Yarn] (command: `yarn`)
53
53
54
54
==== git
55
55
56
56
First, make sure you have git installed.
57
57
58
58
$ git --version
59
59
60
-
If not, {uri-git-dl}[download and install] the git package for your system.
60
+
If not, {url-git-dl}[download and install] the git package for your system.
61
61
62
-
==== Node 8
62
+
==== Node
63
63
64
-
Next, make sure that you have Node 8 installed.
64
+
Next, make sure that you have Node.js (herein "`Node`") installed.
65
65
66
66
$ node --version
67
67
68
68
If this command fails with an error, you don't have Node installed.
69
-
If the command doesn't report a Node 8 version (e.g., v8.9.4), you don't have a suitable version of Node installed.
69
+
If the command doesn't report a Node LTS version (e.g., v10.14.2), you don't have a suitable version of Node installed.
70
70
71
-
While you can install Node from the official packages, we strongly recommend that you use {uri-nvm}[nvm] (Node Version Manager) to install and manage Node.
72
-
Follow the {uri-nvm-install}[nvm installation instructions] to set up nvm on your machine.
71
+
While you can install Node from the official packages, we strongly recommend that you use {url-nvm}[nvm] (Node Version Manager) to install and manage Node.
72
+
Follow the {url-nvm-install}[nvm installation instructions] to set up nvm on your machine.
73
73
74
-
Once you've installed nvm, open a new terminal and install Node 8 using the following command:
74
+
Once you've installed nvm, open a new terminal and install Node 10 using the following command:
75
75
76
-
$ nvm install 8
76
+
$ nvm install 10
77
77
78
78
You can switch to this version of Node at any time using the following command:
79
79
80
-
$ nvm use 8
80
+
$ nvm use 10
81
81
82
-
To make Node 8 the default in new terminals, type:
82
+
To make Node 10 the default in new terminals, type:
83
83
84
-
$ nvm alias default 8
84
+
$ nvm alias default 10
85
85
86
-
Now that you have Node 8 installed, you can proceed with installing the Gulp CLI and Yarn.
86
+
Now that you have Node 10 installed, you can proceed with installing the Gulp CLI and Yarn.
87
87
88
88
==== Gulp CLI
89
89
@@ -109,7 +109,7 @@ Now that you have the prerequisites installed, you can fetch and build the defau
109
109
Clone the default UI project using git:
110
110
111
111
[subs=attributes+]
112
-
$ git clone {uri-project} &&
112
+
$ git clone {url-project} &&
113
113
cd "`basename $_`"
114
114
115
115
The example above clones Antora's default UI project and then switches to the project folder on your filesystem.
@@ -133,33 +133,34 @@ To build the UI and preview it in a local web server, run the `preview` command:
133
133
134
134
$ gulp preview
135
135
136
-
You'll see two URLs listed in the output of this command:
136
+
You'll see a URL listed in the output of this command:
137
137
138
138
....
139
-
[BS] Access URLs:
140
-
----------------------------------
141
-
Local: http://localhost:5252
142
-
External: http://192.168.1.7:5252
143
-
----------------------------------
144
-
[BS] Serving files from: build
145
-
[BS] Watching files...
139
+
[12:59:28] Starting 'preview:serve'...
140
+
[12:59:28] Starting server...
141
+
[12:59:28] Server started http://localhost:5252
142
+
[12:59:28] Running server
146
143
....
147
144
148
-
Navigate to the first URL to see the preview site.
145
+
Navigate to that URL to view the preview site.
149
146
150
147
While this command is running, any changes you make to the source files will be instantly reflected in the browser.
151
-
This works by monitoring the project for changes, running the `build` task if a change is detected, and sending the updates to the browser.
148
+
This works by monitoring the project for changes, running the `preview:build` task if a change is detected, and sending the updates to the browser.
152
149
153
150
Press kbd:[Ctrl+C] to stop the preview server and end the continuous build.
154
151
155
152
=== Package for Use with Antora
156
153
157
-
If you need to package the UI in order to preview the UI on the real site in local development, run the following command:
154
+
If you need to bundle the UI in order to preview the UI on the real site in local development, run the following command:
158
155
159
-
$ gulp pack
156
+
$ gulp bundle
160
157
161
158
The UI bundle will be available at [.path]_build/ui-bundle.zip_.
162
-
You can then point Antora at this bundle using the `--ui-bundle` command-line option.
159
+
You can then point Antora at this bundle using the `--ui-bundle-url` command-line option.
160
+
161
+
If you have the preview running, and you want to bundle without causing the preview to be clobbered, use:
162
+
163
+
$ gulp bundle:pack
163
164
164
165
== Copyright and License
165
166
@@ -170,4 +171,4 @@ See link:LICENSE[] to find the full license text.
170
171
171
172
== Authors
172
173
173
-
Development of Antora is led and sponsored by {uri-opendevise}[OpenDevise Inc].
174
+
Development of Antora is led and sponsored by {url-opendevise}[OpenDevise Inc].
Templates contain placeholders (i.e., mustache expressions like `+{{{page.title}}}+`) into which content is injected from a model.
50
50
They also accommodate simple logic expressions for repeating content or including it conditionally (e.g., `+{{#each navigation}}+`) as well as partials (e.g., `+{{> header}}+`).
{uri-gulp}[Gulp] is a build tool for JavaScript projects.
54
54
It configures a collection of tasks that can be used to perform automated tasks such as compiling files, running a preview server, or publishing a release.
55
55
@@ -91,7 +91,9 @@ Here's how the files are structured in the UI project:
91
91
[.output]
92
92
....
93
93
README.adoc
94
-
gulpfile.js
94
+
gulpfile.js/
95
+
index.js
96
+
...
95
97
package.json
96
98
yarn.lock
97
99
src/
@@ -123,16 +125,6 @@ src/
123
125
preview-site-src/
124
126
index.html
125
127
ui-model.yml
126
-
tasks/
127
-
lib/
128
-
gulp-prettier-eslint.js
129
-
build.js
130
-
build-preview.js
131
-
format.js
132
-
lint-css.js
133
-
lint-js.js
134
-
pack.js
135
-
preview.js
136
128
....
137
129
138
130
A Gulp build is used to compile and assemble the UI project files into a UI bundle.
0 commit comments