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
Copy file name to clipboardExpand all lines: README.md
+14-6Lines changed: 14 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,7 +4,7 @@ The PatternFly Org is the source for the official documentation for PatternFly.
4
4
5
5
## Development
6
6
7
-
Development setup requirespnpm. If you do not already havepnpm installed on your system, see https://yarnpkg.com/getting-started.
7
+
Development setup requires PNPM. If you do not already have PNPM installed on your system, see https://pnpm.io/installation#using-corepack
8
8
9
9
A Node version 22 or greater is also required.
10
10
@@ -14,17 +14,23 @@ A Node version 22 or greater is also required.
14
14
15
15
You can install the NPM dependencies with:
16
16
17
-
pnpm install
17
+
```sh
18
+
pnpm install
19
+
```
18
20
19
21
A local development server at http://localhost:8003 can be started with:
20
22
21
-
pnpm start
23
+
```sh
24
+
pnpm start
25
+
```
22
26
23
27
### Build
24
28
25
29
The site can be built with:
26
30
27
-
pnpm build
31
+
```sh
32
+
pnpm build
33
+
```
28
34
29
35
The static assets get copied to build/patternfly-org.
30
36
@@ -39,7 +45,7 @@ When PatternFly does a release (currently every 3 weeks) this bucket is copied t
39
45
### Update screenshots
40
46
To update the screenshots (these are the images that you click on to see a full-page demo):
41
47
42
-
- open a terminal and run `pnpm build &&pnpm serve`
48
+
- open a terminal and run `pnpm build &&pnpm serve`
43
49
- in another terminal, run `pnpm screenshots`
44
50
45
51
Make sure that the version of Chromium you are using is relatively recent. Version 112.0.5614.0 (Developer Build), for example, isn't compatible with the latest versions of PatternFly, and your screenshots will be off.
@@ -50,7 +56,9 @@ Browse the screenshots to make sure that nothing seems super off. You can compar
50
56
51
57
You might have a dirty file tree with old submodules and folders lying around. You can remove these with:
To get started, you can scaffold out a sample extension docs setup:
31
37
32
-
`npx pf-docs-framework init --name "My extension"`
38
+
```sh
39
+
npx pf-docs-framework init --name "My extension"
40
+
```
33
41
34
42
If you also want to add relevant script targets to package.json, pass in`--scripts` as well:
35
43
36
-
`npx pf-docs-framework init --name "My extension" --scripts`
44
+
```sh
45
+
npx pf-docs-framework init --name "My extension" --scripts
46
+
```
37
47
38
48
## Usage
39
49
40
-
For all CLI options, run `npx pf-docs-framework --help`
50
+
For all CLI options, run:
51
+
52
+
```sh
53
+
npx pf-docs-framework --help
54
+
```
55
+
56
+
For individual CLI commands, you can also display more information by running:
41
57
42
-
For individual CLI commands, you can also display more information by running `npx pf-docs-framework <COMMAND> --help`
58
+
```sh
59
+
npx pf-docs-framework <COMMAND> --help
60
+
```
43
61
44
62
### Develop docs
45
63
46
-
`npx pf-docs-framework start`
64
+
```sh
65
+
npx pf-docs-framework start
66
+
```
47
67
48
68
### Build docs
49
69
50
-
`npx pf-docs-framework build all --output public`
70
+
```sh
71
+
npx pf-docs-framework build all --output public
72
+
```
51
73
52
-
> NOTE: If you have `sideEffects: false` in your package.json, that will prevent the CSS from loading in the documentation production build. Set it to true or remove it to enable the CSS from being loaded.
74
+
> [!NOTE]
75
+
> If you have `sideEffects: false`in your package.json, that will prevent the CSS from loading in the documentation production build. Set it to true or remove it to enable the CSS from being loaded.
Copy file name to clipboardExpand all lines: packages/documentation-site/patternfly-docs/content/get-started/develop.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -13,7 +13,7 @@ In order to develop with PatternFly, you will need to:
13
13
14
14
1.[Learn about our design token system](/tokens/about-tokens), which enables you to build interfaces with consistent PatternFly styling, including colors, shadows, spacing, and more.
15
15
16
-
1. Install a package manager to help you install, update, and configure all necessary PatternFly packages. We recommend [npm](https://nodejs.org/en/download) or [Yarn](https://yarnpkg.com/getting-started).
16
+
1. Install a package manager to help you install, update, and configure all necessary PatternFly packages. We recommend [npm](https://nodejs.org/en/download) or [PNPM](https://pnpm.io/installation).
17
17
18
18
1. Configure your environment to get started with our [React](#develop-with-react) and/or [HTML/CSS](#develop-with-htmlcss) libraries.
0 commit comments