Skip to content

Commit 2d9894f

Browse files
geodicgeodic
authored
Added multiple package managers to all instructions (#793)
1 parent 855e6f3 commit 2d9894f

File tree

14 files changed

+316
-21
lines changed

14 files changed

+316
-21
lines changed

Diff for: ‎src/routes/configuration/typescript.mdx

+50-2
Original file line numberDiff line numberDiff line change
@@ -52,11 +52,59 @@ Transitioning from JavaScript to TypeScript in a Solid project offers the benefi
5252

5353
1. Install TypeScript into your project.
5454

55+
<TabsCodeBlocks>
56+
<div id="npm">
5557
```bash frame="none"
56-
npm install --save-dev typescript
58+
npm i --save-dev typescript
5759
```
60+
</div>
5861

59-
2. Run `npx tsc --init` to generate a `tsconfig.json` file.
62+
<div id="yarn">
63+
```bash frame="none"
64+
yarn add --dev typescript
65+
```
66+
</div>
67+
68+
<div id="pnpm">
69+
```bash frame="none"
70+
pnpm add --save-dev typescript
71+
```
72+
</div>
73+
74+
<div id="bun">
75+
```bash frame="none"
76+
bun add --save-dev typescript
77+
```
78+
</div>
79+
</TabsCodeBlocks>
80+
81+
2. Run the following command to generate a `tsconfig.json` file.
82+
83+
<TabsCodeBlocks>
84+
<div id="npm">
85+
```bash frame="none"
86+
npx tsc --init
87+
```
88+
</div>
89+
90+
<div id="yarn">
91+
```bash frame="none"
92+
yarn dlx tsc --init
93+
```
94+
</div>
95+
96+
<div id="pnpm">
97+
```bash frame="none"
98+
pnpm dlx tsc --init
99+
```
100+
</div>
101+
102+
<div id="bun">
103+
```bash frame="none"
104+
bunx tsc --init
105+
```
106+
</div>
107+
</TabsCodeBlocks>
60108

61109
3. Update the contents of the `tsconfig.json` to match Solid's configuration:
62110

Diff for: ‎src/routes/guides/deployment-options/cloudflare.mdx

+38-3
Original file line numberDiff line numberDiff line change
@@ -65,11 +65,21 @@ npm i -g wrangler
6565
```
6666
</div>
6767

68-
<div id="yarn">```bash frame="none" yarn global add wrangler ```</div>
68+
<div id="yarn">
69+
```bash frame="none"
70+
yarn global add wrangler
71+
```
72+
</div>
6973

7074
<div id="pnpm">
7175
```bash frame="none"
72-
pnpm i -g wrangler
76+
pnpm add -g wrangler
77+
```
78+
</div>
79+
80+
<div id="bun">
81+
```bash frame="none"
82+
bun add -g wrangler
7383
```
7484
</div>
7585
</TabsCodeBlocks>
@@ -82,10 +92,35 @@ wrangler login
8292

8393
3. Execute the following commands to build your project and deploy it using Wrangler:
8494

95+
<TabsCodeBlocks>
96+
<div id="npm">
8597
```bash frame="none"
8698
npm run build
87-
npx wrangler pages publish dist
99+
wrangler pages publish dist
100+
```
101+
</div>
102+
103+
<div id="yarn">
104+
```bash frame="none"
105+
yarn build
106+
wrangler pages publish dist
88107
```
108+
</div>
109+
110+
<div id="pnpm">
111+
```bash frame="none"
112+
pnpm build
113+
wrangler pages publish dist
114+
```
115+
</div>
116+
117+
<div id="bun">
118+
```bash frame="none"
119+
bun build
120+
wrangler pages publish dist
121+
```
122+
</div>
123+
</TabsCodeBlocks>
89124

90125
After running these commands, your project should be live.
91126
While the terminal may provide a link, it's more reliable to check your Cloudflare Pages dashboard for the deployed URL, which usually follows the format `project-name.pages.dev`.

Diff for: ‎src/routes/guides/deployment-options/firebase.mdx

+12-2
Original file line numberDiff line numberDiff line change
@@ -23,11 +23,21 @@ npm i -g firebase-tools
2323
```
2424
</div>
2525

26-
<div id="yarn">``` bash yarn global add firebase-tools ```</div>
26+
<div id="yarn">
27+
``` bash frame="none"
28+
yarn global add firebase-tools
29+
```
30+
</div>
2731

2832
<div id="pnpm">
2933
```bash frame="none"
30-
pnpm i -g firebase-tools
34+
pnpm add -g firebase-tools
35+
```
36+
</div>
37+
38+
<div id="bun">
39+
```bash frame="none"
40+
bun add -g firebase-tools
3141
```
3242
</div>
3343
</TabsCodeBlocks>

Diff for: ‎src/routes/guides/deployment-options/netlify.mdx

+12-2
Original file line numberDiff line numberDiff line change
@@ -47,11 +47,21 @@ npm i -g netlify-cli
4747
```
4848
</div>
4949

50-
<div id="yarn">```bash frame="none" yarn global add netlify-cli ```</div>
50+
<div id="yarn">
51+
```bash frame="none"
52+
yarn global add netlify-cli
53+
```
54+
</div>
5155

5256
<div id="pnpm">
5357
```bash frame="none"
54-
pnpm i -g netlify-cli
58+
pnpm add -g netlify-cli
59+
```
60+
</div>
61+
62+
<div id="bun">
63+
```bash frame="none"
64+
bun add -g netlify-cli
5565
```
5666
</div>
5767
</TabsCodeBlocks>

Diff for: ‎src/routes/guides/deployment-options/railway.mdx

+12-2
Original file line numberDiff line numberDiff line change
@@ -78,11 +78,21 @@ npm i -g @railway/cli
7878
```
7979
</div>
8080

81-
<div id="yarn">```bash frame="none" yarn global add @railway/cli ```</div>
81+
<div id="yarn">
82+
```bash frame="none"
83+
yarn global add @railway/cli
84+
```
85+
</div>
8286

8387
<div id="pnpm">
8488
```bash frame="none"
85-
pnpm i -g @railway/cli
89+
pnpm add -g @railway/cli
90+
```
91+
</div>
92+
93+
<div id="bun">
94+
```bash frame="none"
95+
bun add -g @railway/cli
8696
```
8797
</div>
8898
</TabsCodeBlocks>

Diff for: ‎src/routes/guides/deployment-options/vercel.mdx

+12-2
Original file line numberDiff line numberDiff line change
@@ -58,11 +58,21 @@ npm i -g vercel
5858
```
5959
</div>
6060

61-
<div id="yarn">```bash frame="none" yarn global add vercel ```</div>
61+
<div id="yarn">
62+
```bash frame="none"
63+
yarn global add vercel
64+
```
65+
</div>
6266

6367
<div id="pnpm">
6468
```bash frame="none"
65-
pnpm i -g vercel
69+
pnpm add -g vercel
70+
```
71+
</div>
72+
73+
<div id="bun">
74+
```bash frame="none"
75+
bun add -g vercel
6676
```
6777
</div>
6878
</TabsCodeBlocks>

Diff for: ‎src/routes/guides/routing-and-navigation.mdx

+9-2
Original file line numberDiff line numberDiff line change
@@ -22,12 +22,19 @@ npm install @solidjs/router
2222

2323
<div id="yarn">
2424
```bash frame="none"
25-
yarn add @solidjs/router
25+
yarn add @solidjs/router
2626
```
2727
</div>
28+
2829
<div id="pnpm">
2930
```bash frame="none"
30-
pnpm i @solidjs/router
31+
pnpm add @solidjs/router
32+
```
33+
</div>
34+
35+
<div id="bun">
36+
```bash frame="none"
37+
bun add @solidjs/router
3138
```
3239
</div>
3340
</TabsCodeBlocks>

Diff for: ‎src/routes/guides/styling-components/less.mdx

+7-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,13 @@ yarn add --dev less
2626

2727
<div id="pnpm">
2828
```bash frame="none"
29-
pnpm i --dev less
29+
pnpm add --dev less
30+
```
31+
</div>
32+
33+
<div id="bun">
34+
```bash frame="none"
35+
bun add --dev less
3036
```
3137
</div>
3238
</TabsCodeBlocks>

Diff for: ‎src/routes/guides/styling-components/macaron.mdx

+7-1
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,13 @@ yarn add @macaron-css/core @macaron-css/solid
2525

2626
<div id="pnpm">
2727
```bash frame="none"
28-
pnpm i @macaron-css/core @macaron-css/solid
28+
pnpm add @macaron-css/core @macaron-css/solid
29+
```
30+
</div>
31+
32+
<div id="bun">
33+
```bash frame="none"
34+
bun add @macaron-css/core @macaron-css/solid
2935
```
3036
</div>
3137
</TabsCodeBlocks>

Diff for: ‎src/routes/guides/styling-components/sass.mdx

+7-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,13 @@ yarn add --dev sass
2626

2727
<div id="pnpm">
2828
```bash frame="none"
29-
pnpm i --dev sass
29+
pnpm add --dev sass
30+
```
31+
</div>
32+
33+
<div id="bun">
34+
```bash frame="none"
35+
bun add --dev sass
3036
```
3137
</div>
3238
</TabsCodeBlocks>

Diff for: ‎src/routes/guides/styling-components/tailwind.mdx

+29-2
Original file line numberDiff line numberDiff line change
@@ -25,17 +25,44 @@ yarn add --dev tailwindcss postcss autoprefixer
2525

2626
<div id="pnpm">
2727
```bash frame="none"
28-
pnpm i --save-dev tailwindcss postcss autoprefixer
28+
pnpm add --save-dev tailwindcss postcss autoprefixer
29+
```
30+
</div>
31+
32+
<div id="bun">
33+
```bash frame="none"
34+
bun add --save-dev tailwindcss postcss autoprefixer
2935
```
3036
</div>
3137
</TabsCodeBlocks>
3238

3339
2. Next, run the init command to generate both `tailwind.config.js` and `postcss.config.js`.
3440

41+
<TabsCodeBlocks>
42+
<div id="npm">
3543
```bash frame="none"
36-
3744
npx tailwindcss init -p
3845
```
46+
</div>
47+
48+
<div id="yarn">
49+
```bash frame="none"
50+
yarn dlx tailwindcss init -p
51+
```
52+
</div>
53+
54+
<div id="pnpm">
55+
```bash frame="none"
56+
pnpm dlx tailwindcss init -p
57+
```
58+
</div>
59+
60+
<div id="bun">
61+
```bash frame="none"
62+
bunx tailwindcss init -p
63+
```
64+
</div>
65+
</TabsCodeBlocks>
3966

4067
3. Since TailwindCSS is configuration-driven, after initializing, a `tailwind.config.js` file will be created at the root of your project directory:
4168

Diff for: ‎src/routes/guides/styling-components/uno.mdx

+7-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,13 @@ yarn add --dev unocss
2424

2525
<div id="pnpm">
2626
```bash frame="none"
27-
pnpm i --save-dev unocss
27+
pnpm add --save-dev unocss
28+
```
29+
</div>
30+
31+
<div id="bun">
32+
```bash frame="none"
33+
bun add --save-dev unocss
2834
```
2935
</div>
3036
</TabsCodeBlocks>

0 commit comments

Comments
 (0)