@toolsplus/nx-forge 1.0.0 → 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +159 -6
- package/package.json +3 -3
- package/src/generators/application/files/tsconfig.app.json +0 -1
- package/src/generators/application/lib/get-build-config.d.ts +1 -1
- package/src/generators/application/lib/get-build-config.js.map +1 -1
- package/src/generators/application/lib/get-deploy-config.d.ts +1 -1
- package/src/generators/application/lib/get-deploy-config.js.map +1 -1
- package/src/generators/application/lib/get-serve-config.d.ts +1 -1
- package/src/generators/application/lib/get-serve-config.js.map +1 -1
package/README.md
CHANGED
|
@@ -1,11 +1,164 @@
|
|
|
1
|
-
#
|
|
1
|
+
# Nx Forge
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
[Nx plugin](https://nx.dev) for [Atlassian Forge](https://developer.atlassian.com/platform/forge/) that aims to assist in efficient, scalable app development and remove the mental overhead of how to set up a Forge project.
|
|
4
|
+
Building on top of Nx means shared code can easily be extracted into libraries, and [Custom UI](https://developer.atlassian.com/platform/forge/custom-ui/) can be integrated into the app and dev workflow without having to break with the monorepo structure that Nx provides.
|
|
4
5
|
|
|
5
|
-
##
|
|
6
|
+
## Prerequisites
|
|
6
7
|
|
|
7
|
-
|
|
8
|
+
The following setup procedure assumes you already have a Nx workspace. If you do not, make sure to create one using
|
|
8
9
|
|
|
9
|
-
|
|
10
|
+
```shell
|
|
11
|
+
npx create-nx-workspace <workspace-name> --preset=apps
|
|
12
|
+
```
|
|
10
13
|
|
|
11
|
-
|
|
14
|
+
You will be asked if you would like to use Nx Cloud or not (either option is fine). Once, the workspace has been created run `cd <workspace-name>`.
|
|
15
|
+
|
|
16
|
+
Finally, make sure your workspace has the following package installed
|
|
17
|
+
|
|
18
|
+
```shell
|
|
19
|
+
npm install --save-dev @nrwl/js
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
## Setting up
|
|
24
|
+
|
|
25
|
+
### Install the plugin
|
|
26
|
+
|
|
27
|
+
Add the plugin to your Nx workspace using
|
|
28
|
+
|
|
29
|
+
```shell
|
|
30
|
+
npm install --save-dev @toolsplus/nx-forge
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
or
|
|
34
|
+
|
|
35
|
+
```shell
|
|
36
|
+
yarn add --dev @toolsplus/nx-forge
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
### Generate a Forge app
|
|
40
|
+
|
|
41
|
+
Once installed, run the Forge app generator to generate a Forge app.
|
|
42
|
+
|
|
43
|
+
```shell
|
|
44
|
+
nx g @toolsplus/nx-forge:app <forge-app-name>
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
> Hint: You can use the `--dry-run` flag to see what will be generated.
|
|
48
|
+
|
|
49
|
+
Replacing `<forge-app-name>` with the name of the app you're wanting to create.
|
|
50
|
+
|
|
51
|
+
### Add a Custom UI module
|
|
52
|
+
|
|
53
|
+
Forge apps require at least one module before they can be deployed. Let's start with a simple Custom UI module to get started. If you have not yet installed `@nrwl/react` in your workspace call `npm i -D @nrwl/react`. This allows us to generate a React application for our Custom UI:
|
|
54
|
+
|
|
55
|
+
nx g @nrwl/react:app <custom-ui-app-name>
|
|
56
|
+
|
|
57
|
+
> Hint: You can use the `--dry-run` flag to see what will be generated.
|
|
58
|
+
|
|
59
|
+
Replacing `<custom-ui-app-name>` with the name of the Custom UI project you're wanting to create.
|
|
60
|
+
|
|
61
|
+
To get this React app working as a Forge Custom UI update the `apps/<custom-ui-app-name>/project.json` file by replacing the `baseHref` value in the build options with `.` instead of `/` ([refer to the Forge docs for additional details](https://developer.atlassian.com/platform/forge/custom-ui/#accessing-static-assets)):
|
|
62
|
+
|
|
63
|
+
```
|
|
64
|
+
{
|
|
65
|
+
"root": "apps/<custom-ui-app-name>",
|
|
66
|
+
"sourceRoot": "apps/<custom-ui-app-name>/src",
|
|
67
|
+
"projectType": "application",
|
|
68
|
+
"targets": {
|
|
69
|
+
"build": {
|
|
70
|
+
"executor": "@nrwl/web:webpack",
|
|
71
|
+
"outputs": ["{options.outputPath}"],
|
|
72
|
+
"defaultConfiguration": "production",
|
|
73
|
+
"options": {
|
|
74
|
+
"compiler": "babel",
|
|
75
|
+
"outputPath": "dist/apps/<custom-ui-app-name>",
|
|
76
|
+
"index": "apps/<custom-ui-app-name>/src/index.html",
|
|
77
|
+
-----> "baseHref": ".",
|
|
78
|
+
...
|
|
79
|
+
}
|
|
80
|
+
},
|
|
81
|
+
...
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
```
|
|
85
|
+
|
|
86
|
+
### Wire the Custom UI project with the Forge app project
|
|
87
|
+
|
|
88
|
+
Back in the Forge app project, open the generated `manifest.yml` file and add a Custom UI module and the corresponding resource entry:
|
|
89
|
+
|
|
90
|
+
```yaml
|
|
91
|
+
modules:
|
|
92
|
+
jira:projectPage:
|
|
93
|
+
- key: project-page
|
|
94
|
+
title: Project page Custom UI
|
|
95
|
+
layout: basic
|
|
96
|
+
resource: project-page
|
|
97
|
+
resolver:
|
|
98
|
+
function: resolver
|
|
99
|
+
function:
|
|
100
|
+
- key: resolver
|
|
101
|
+
handler: index.handler
|
|
102
|
+
resources:
|
|
103
|
+
- key: project-page
|
|
104
|
+
path: <custom-ui-app-name>
|
|
105
|
+
tunnel:
|
|
106
|
+
port: 4200
|
|
107
|
+
permissions:
|
|
108
|
+
content:
|
|
109
|
+
styles:
|
|
110
|
+
- 'unsafe-inline'
|
|
111
|
+
app:
|
|
112
|
+
id: ari:cloud:ecosystem::app/to-be-generated
|
|
113
|
+
```
|
|
114
|
+
|
|
115
|
+
The most important bit to note here is that the `path` property of the `project-page` resource should refer to the Custom UI project name from the previous step. This tells the Nx Forge plugin which Nx app project corresponds to `project-page` resource. The plugin will replace this path with the actual Custom UI build artifact during the Forge app build.
|
|
116
|
+
|
|
117
|
+
Finally, update the `apps/<forge-app-name>/project.json` file in the generated Forge app project to define an implicit dependency to the Custom UI project.
|
|
118
|
+
|
|
119
|
+
```json
|
|
120
|
+
{
|
|
121
|
+
"root": "apps/<forge-app-name>",
|
|
122
|
+
"sourceRoot": "apps/<forge-app-name>/src",
|
|
123
|
+
"projectType": "application",
|
|
124
|
+
"targets": {
|
|
125
|
+
|
|
126
|
+
},
|
|
127
|
+
"implicitDependencies": ["<custom-ui-app-name>"]
|
|
128
|
+
}
|
|
129
|
+
```
|
|
130
|
+
|
|
131
|
+
This tells Nx that each time we build our Forge app, it needs to build the Custom UI project first.
|
|
132
|
+
|
|
133
|
+
### Initial build and registration
|
|
134
|
+
|
|
135
|
+
Before you can deploy the Forge app it needs to be registered with the Forge platform. To do this, initially build the Forge app using
|
|
136
|
+
|
|
137
|
+
nx build <forge-app-name>
|
|
138
|
+
|
|
139
|
+
Once that's finished, go to `dist/apps/<forge-app-name>` and run the following three commands
|
|
140
|
+
|
|
141
|
+
```shell
|
|
142
|
+
forge register
|
|
143
|
+
forge deploy
|
|
144
|
+
forge install
|
|
145
|
+
```
|
|
146
|
+
|
|
147
|
+
The Forge app is now registered, deployed and installed with the Forge platform. As a final last step, open the `dist/apps/<forge-app-name>/manifest.yml` and copy-paste the app id that was generated during app registration into the Forge app project under `apps/<forge-app-name>/manifest.yml`:
|
|
148
|
+
|
|
149
|
+
```yaml
|
|
150
|
+
app:
|
|
151
|
+
id: ari:cloud:ecosystem::app/f2fc9c8f-5947-7da7-32ab-6367647e4b1a
|
|
152
|
+
```
|
|
153
|
+
|
|
154
|
+
That's it for the setup steps. You can now generate additional Custom UI resources, generate shared Nx libraries to keep shared app logic and depend on it in one or more Forge apps.
|
|
155
|
+
|
|
156
|
+
## Using the Nx Forge plugin
|
|
157
|
+
|
|
158
|
+
### Build
|
|
159
|
+
|
|
160
|
+
Run `nx build <forge-app-name>` to build the project. The build artifacts will be stored in the `dist/` directory.
|
|
161
|
+
|
|
162
|
+
## Further help on how to develop with Nx
|
|
163
|
+
|
|
164
|
+
Visit the [Nx Documentation](https://nx.dev) to learn more.
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@toolsplus/nx-forge",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.1.1",
|
|
4
4
|
"description": "Atlassian Forge plugin for Nx",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"generators": "./generators.json",
|
|
7
7
|
"executors": "./executors.json",
|
|
8
8
|
"peerDependencies": {
|
|
9
|
-
"@nrwl/js": "^
|
|
10
|
-
"@nrwl/workspace": "^
|
|
9
|
+
"@nrwl/js": "^14.0.0",
|
|
10
|
+
"@nrwl/workspace": "^14.0.0"
|
|
11
11
|
},
|
|
12
12
|
"typings": "./src/index.d.ts",
|
|
13
13
|
"dependencies": {
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { ProjectConfiguration, TargetConfiguration } from 'nx/src/shared/workspace';
|
|
2
1
|
import { NormalizedOptions } from '../schema';
|
|
2
|
+
import { ProjectConfiguration, TargetConfiguration } from '@nrwl/devkit';
|
|
3
3
|
export declare function getBuildConfig(project: ProjectConfiguration, options: NormalizedOptions): TargetConfiguration;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-build-config.js","sourceRoot":"","sources":["../../../../../../../packages/forge/src/generators/application/lib/get-build-config.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"get-build-config.js","sourceRoot":"","sources":["../../../../../../../packages/forge/src/generators/application/lib/get-build-config.ts"],"names":[],"mappings":";;;AACA,yCAIsB;AAEtB,SAAgB,cAAc,CAC5B,OAA6B,EAC7B,OAA0B;IAE1B,OAAO;QACL,QAAQ,EAAE,2BAA2B;QACrC,OAAO,EAAE,CAAC,sBAAsB,CAAC;QACjC,OAAO,EAAE;YACP,UAAU,EAAE,IAAA,0BAAiB,EAAC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC;SAC9D;KACF,CAAC;AACJ,CAAC;AAXD,wCAWC"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { ProjectConfiguration, TargetConfiguration } from 'nx/src/shared/workspace';
|
|
2
1
|
import { NormalizedOptions } from '../schema';
|
|
2
|
+
import { ProjectConfiguration, TargetConfiguration } from '@nrwl/devkit';
|
|
3
3
|
export declare function getDeployConfig(project: ProjectConfiguration, options: NormalizedOptions): TargetConfiguration;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-deploy-config.js","sourceRoot":"","sources":["../../../../../../../packages/forge/src/generators/application/lib/get-deploy-config.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"get-deploy-config.js","sourceRoot":"","sources":["../../../../../../../packages/forge/src/generators/application/lib/get-deploy-config.ts"],"names":[],"mappings":";;;AACA,yCAIsB;AAEtB,SAAgB,eAAe,CAC7B,OAA6B,EAC7B,OAA0B;IAE1B,OAAO;QACL,QAAQ,EAAE,4BAA4B;QACtC,OAAO,EAAE;YACP,UAAU,EAAE,IAAA,0BAAiB,EAAC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC;SAC9D;KACF,CAAC;AACJ,CAAC;AAVD,0CAUC"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { ProjectConfiguration, TargetConfiguration } from 'nx/src/shared/workspace';
|
|
2
1
|
import { NormalizedOptions } from '../schema';
|
|
2
|
+
import { ProjectConfiguration, TargetConfiguration } from '@nrwl/devkit';
|
|
3
3
|
export declare function getServeConfig(project: ProjectConfiguration, options: NormalizedOptions): TargetConfiguration;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-serve-config.js","sourceRoot":"","sources":["../../../../../../../packages/forge/src/generators/application/lib/get-serve-config.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"get-serve-config.js","sourceRoot":"","sources":["../../../../../../../packages/forge/src/generators/application/lib/get-serve-config.ts"],"names":[],"mappings":";;;AACA,yCAIsB;AAEtB,SAAgB,cAAc,CAC5B,OAA6B,EAC7B,OAA0B;IAE1B,OAAO;QACL,QAAQ,EAAE,8BAA8B;QACxC,OAAO,EAAE;YACP,QAAQ,EAAE;gBACR;oBACE,OAAO,EAAE,UAAU,OAAO,CAAC,IAAI,gBAAgB;iBAChD;gBACD;oBACE,OAAO,EAAE,cAAc;iBACxB;aACF;YACD,GAAG,EAAE,IAAA,0BAAiB,EAAC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC;YACtD,QAAQ,EAAE,IAAI;SACf;KACF,CAAC;AACJ,CAAC;AAnBD,wCAmBC"}
|