create-alistt69-kit 0.1.5 → 0.1.7

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.
Files changed (15) hide show
  1. package/README.md +24 -17
  2. package/package.json +1 -1
  3. package/src/features/react-router/files/src/app/App.tsx +7 -0
  4. package/src/features/react-router/files/src/app/layouts/app/index.tsx +24 -5
  5. package/src/features/react-router/files/src/app/layouts/app/styles.module.scss +19 -0
  6. package/src/features/react-router/files/src/app/providers/router/config/router.tsx +2 -2
  7. package/src/features/react-router/files/src/app/styles.module.scss +27 -0
  8. package/src/features/react-router/files/src/pages/error/page.tsx +3 -3
  9. package/src/features/react-router/files/src/pages/main/page.tsx +2 -2
  10. package/src/templates/base/public/create-alistt69-kit-logo.svg +16 -0
  11. package/src/templates/base/public/favicon.ico +0 -0
  12. package/src/templates/base/public/index.html +3 -2
  13. package/src/templates/base/src/app/App.tsx +8 -2
  14. package/src/templates/base/src/app/styles.module.scss +24 -0
  15. package/src/templates/base/src/styles/index.scss +7 -5
package/README.md CHANGED
@@ -1,13 +1,20 @@
1
- # _create-alistt69-kit_
2
-
3
- > **One command. Zero config fatigue.**
4
- > Bootstrap a **React + TypeScript + Webpack** app with a solid starter setup and optional tooling you can enable when you need it.
5
-
6
- [![npm version](https://img.shields.io/npm/v/create-alistt69-kit.svg)](https://www.npmjs.com/package/create-alistt69-kit)
7
- [![Node.js Version](https://img.shields.io/badge/node-%3E%3D18.18-brightgreen)](https://nodejs.org/)
8
- [![License: MIT](https://img.shields.io/badge/license-MIT-blue.svg)](./LICENSE)
9
-
10
- ---
1
+ <div style="display: flex; align-items: center; gap: 30px;">
2
+ <div style="flex-shrink: 0;">
3
+ <img src="./assets/create-alistt69-kit-logo.svg" alt="Logo" width="160" height="160" style="margin-top: 16px;"/>
4
+ </div>
5
+ <div>
6
+ <h1 style="margin: 0;">create-alistt69-kit</h1>
7
+ <blockquote style="margin: 10px 0;">
8
+ <strong>One command. Zero config fatigue.</strong><br/>
9
+ Bootstrap a <strong>React + TypeScript + Webpack</strong> app with a solid starter setup and optional tooling you can enable when you need it.
10
+ </blockquote>
11
+ <p>
12
+ <a href="https://www.npmjs.com/package/create-alistt69-kit"><img src="https://img.shields.io/npm/v/create-alistt69-kit.svg" alt="npm version"/></a>
13
+ <a href="https://nodejs.org/"><img src="https://img.shields.io/badge/node-%3E%3D18.18-brightgreen" alt="Node.js Version"/></a>
14
+ <a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="License: MIT"/></a>
15
+ </p>
16
+ </div>
17
+ </div>
11
18
 
12
19
  ## ✨ Overview
13
20
 
@@ -65,7 +72,7 @@ npm create alistt69-kit@latest
65
72
  Follow the prompts — or skip them entirely:
66
73
 
67
74
  ```bash
68
- npm create alistt69-kit@latest my-app -- --defaults
75
+ npm create alistt69-kit@latest my-app -- -- --defaults
69
76
  ```
70
77
 
71
78
  ## 🛠️ Usage examples
@@ -75,22 +82,22 @@ npm create alistt69-kit@latest my-app -- --defaults
75
82
  npm create alistt69-kit@latest my-app
76
83
 
77
84
  # All defaults, no prompts
78
- npm create alistt69-kit@latest my-app -- --defaults
85
+ npm create alistt69-kit@latest my-app -- -- --defaults
79
86
 
80
87
  # Skip dependency installation
81
- npm create alistt69-kit@latest my-app -- --no-install
88
+ npm create alistt69-kit@latest my-app -- -- --no-install
82
89
 
83
90
  # Enable only selected features
84
- npm create alistt69-kit@latest my-app -- --features=eslint,react-router
91
+ npm create alistt69-kit@latest my-app -- -- --features=eslint,react-router
85
92
 
86
93
  # Enable all optional features
87
- npm create alistt69-kit@latest my-app -- --features=all
94
+ npm create alistt69-kit@latest my-app -- -- --features=all
88
95
 
89
96
  # Use pnpm as package manager
90
- npm create alistt69-kit@latest my-app -- --pm pnpm
97
+ npm create alistt69-kit@latest my-app -- -- --pm pnpm
91
98
 
92
99
  # Overwrite existing directory
93
- npm create alistt69-kit@latest my-app -- --defaults --overwrite
100
+ npm create alistt69-kit@latest my-app -- -- --defaults --overwrite
94
101
  ```
95
102
 
96
103
  ## ⚙️ CLI options
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-alistt69-kit",
3
- "version": "0.1.5",
3
+ "version": "0.1.7",
4
4
  "description": "Opinionated React + TypeScript + Webpack project generator by alistt69",
5
5
  "keywords": [
6
6
  "create",
package/src/features/react-router/files/src/app/App.tsx CHANGED
@@ -1,10 +1,17 @@
1
1
  import { RouterProvider } from 'react-router-dom';
2
+ import Logo from '../../public/create-alistt69-kit-logo.svg';
2
3
  import { appRouter } from './providers/router/config/router';
3
4
  import styles from './styles.module.scss';
4
5
 
5
6
  function App() {
6
7
  return (
7
8
  <div className={styles.app_wrapper}>
9
+ <div className={styles.created_by_section}>
10
+ <Logo className={styles.logo} />
11
+ <p className={styles.promo}>
12
+ created by create-alistt69-kit
13
+ </p>
14
+ </div>
8
15
  <RouterProvider router={appRouter} />
9
16
  </div>
10
17
  );
package/src/features/react-router/files/src/app/layouts/app/index.tsx CHANGED
@@ -1,13 +1,32 @@
1
- import { Link, Outlet } from 'react-router-dom';
1
+ import clsx from 'clsx';
2
+ import { NavLink, Outlet } from 'react-router-dom';
3
+ import styles from './styles.module.scss';
2
4
 
3
5
  export default function AppLayout() {
4
6
  return (
5
- <div>
6
- <header>
7
+ <div className={styles.layout_wrapper}>
8
+ <aside className={styles.sidebar}>
7
9
  <nav>
8
- <Link to="/">Home</Link>
10
+ <NavLink
11
+ className={({ isActive }) => clsx({
12
+ [styles.active]: isActive,
13
+ })}
14
+ to="/"
15
+ >
16
+ Main
17
+ </NavLink>
9
18
  </nav>
10
- </header>
19
+ <nav>
20
+ <NavLink
21
+ className={({ isActive }) => clsx({
22
+ [styles.active]: isActive,
23
+ })}
24
+ to="/error-route"
25
+ >
26
+ Error
27
+ </NavLink>
28
+ </nav>
29
+ </aside>
11
30
 
12
31
  <main>
13
32
  <Outlet />
package/src/features/react-router/files/src/app/layouts/app/styles.module.scss ADDED
@@ -0,0 +1,19 @@
1
+ .layout_wrapper {
2
+ display: flex;
3
+ justify-content: space-between;
4
+ min-width: 210px;
5
+
6
+ .sidebar > nav > a {
7
+ opacity: .7;
8
+ color: inherit;
9
+ transition: opacity .2s ease;
10
+
11
+ &.active {
12
+ opacity: 1;
13
+ }
14
+ }
15
+
16
+ h2 {
17
+ margin: 0;
18
+ }
19
+ }
package/src/features/react-router/files/src/app/providers/router/config/router.tsx CHANGED
@@ -1,7 +1,7 @@
1
1
  import { createBrowserRouter, createRoutesFromElements, Route } from 'react-router-dom';
2
- import AppLayout from '../../../layouts/app';
3
- import { Main } from '../../../../pages/main';
4
2
  import { Error } from '../../../../pages/error';
3
+ import { Main } from '../../../../pages/main';
4
+ import AppLayout from '../../../layouts/app';
5
5
 
6
6
  export const appRouter = createBrowserRouter(
7
7
  createRoutesFromElements(
package/src/features/react-router/files/src/app/styles.module.scss ADDED
@@ -0,0 +1,27 @@
1
+ .app_wrapper {
2
+ height: 90vh;
3
+ width: 100vw;
4
+ display: flex;
5
+ align-items: center;
6
+ justify-content: center;
7
+ flex-direction: column;
8
+
9
+ .created_by_section {
10
+ position: relative;
11
+ height: 270px;
12
+ width: 210px;
13
+
14
+ .logo {
15
+ top: -360px;
16
+ right: 50%;
17
+ left: 50%;
18
+ transform: translateX(-50%) scale(0.19);
19
+ position: absolute;
20
+ }
21
+
22
+ .promo {
23
+ position: absolute;
24
+ bottom: 0;
25
+ }
26
+ }
27
+ }
package/src/features/react-router/files/src/pages/error/page.tsx CHANGED
@@ -1,7 +1,7 @@
1
1
  function ErrorPage() {
2
2
  return (
3
- <h2>Error page</h2>
4
- )
3
+ <h2>error page</h2>
4
+ );
5
5
  }
6
6
 
7
- export default ErrorPage;
7
+ export default ErrorPage;
package/src/features/react-router/files/src/pages/main/page.tsx CHANGED
@@ -1,7 +1,7 @@
1
1
  function MainPage() {
2
2
  return (
3
3
  <h2>main page</h2>
4
- )
4
+ );
5
5
  }
6
6
 
7
- export default MainPage;
7
+ export default MainPage;
package/src/templates/base/public/create-alistt69-kit-logo.svg ADDED
@@ -0,0 +1,16 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
3
+ <svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="1031px" height="1031px" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" xmlns:xlink="http://www.w3.org/1999/xlink">
4
+ <g><path style="opacity:1" fill="#141617" d="M -0.5,-0.5 C 343.167,-0.5 686.833,-0.5 1030.5,-0.5C 1030.5,343.167 1030.5,686.833 1030.5,1030.5C 686.833,1030.5 343.167,1030.5 -0.5,1030.5C -0.5,686.833 -0.5,343.167 -0.5,-0.5 Z"/></g>
5
+ <g><path style="opacity:1" fill="#a1a1a7" d="M 904.5,722.5 C 897.833,722.5 891.167,722.5 884.5,722.5C 884.795,720.265 884.461,718.265 883.5,716.5C 883.068,695.816 880.402,675.483 875.5,655.5C 875.59,652.848 874.924,650.515 873.5,648.5C 870.907,637.801 867.241,627.468 862.5,617.5C 803.665,685.254 729.331,723.421 639.5,732C 589.655,736.635 540.322,733.468 491.5,722.5C 409.37,748.415 330.037,741.915 253.5,703C 212.877,680.374 180.043,649.541 155,610.5C 122.581,547.986 120.081,484.486 147.5,420C 132.771,374.005 126.438,326.839 128.5,278.5C 135.5,278.5 142.5,278.5 149.5,278.5C 152.085,314.049 159.585,348.382 172,381.5C 229.036,317.063 300.536,280.229 386.5,271C 438.881,265.308 490.714,268.474 542,280.5C 580.254,266.53 619.754,261.03 660.5,264C 742.772,272.435 809.939,308.268 862,371.5C 891.717,413.673 905.05,460.673 902,512.5C 900.808,526.703 898.475,540.703 895,554.5C 891.764,562.874 888.931,571.374 886.5,580C 901.151,626.324 907.151,673.824 904.5,722.5 Z"/></g>
6
+ <g><path style="opacity:1" fill="#141617" d="M 719.5,363.5 C 772.006,363.169 815.506,382.835 850,422.5C 873.409,454.523 877.575,488.856 862.5,525.5C 825.985,461.91 778.318,407.91 719.5,363.5 Z"/></g>
7
+ <g><path style="opacity:1" fill="#141617" d="M 391.5,372.5 C 406.511,372.438 421.511,372.771 436.5,373.5C 427.208,393.745 421.375,415.079 419,437.5C 418.099,499.775 435.432,556.108 471,606.5C 471.982,607.759 472.315,609.092 472,610.5C 417.998,596.847 367.165,576.014 319.5,548C 274.218,519.051 235.718,482.884 204,439.5C 203.333,438.5 203.333,437.5 204,436.5C 223.412,419.705 245.246,406.871 269.5,398C 309.161,384.156 349.827,375.656 391.5,372.5 Z"/></g>
8
+ <g><path style="opacity:1" fill="#141617" d="M 601.5,402.5 C 607.231,405.077 613.231,407.077 619.5,408.5C 694.649,436.815 759.816,480.149 815,538.5C 821.181,546.678 827.348,554.844 833.5,563C 821.624,574.284 808.291,583.617 793.5,591C 737.47,618.336 678.137,631.169 615.5,629.5C 609.923,629.144 604.59,628.144 599.5,626.5C 619.437,583.266 622.937,538.6 610,492.5C 599.215,456.582 583.382,423.249 562.5,392.5C 575.58,394.688 588.58,398.021 601.5,402.5 Z"/></g>
9
+ <g><path style="opacity:1" fill="#848588" d="M 601.5,402.5 C 604.089,403.127 606.589,403.127 609,402.5C 610.169,403.009 611.002,403.842 611.5,405C 613.556,405.311 615.556,405.811 617.5,406.5C 620.506,404.996 621.172,405.663 619.5,408.5C 613.231,407.077 607.231,405.077 601.5,402.5 Z"/></g>
10
+ <g><path style="opacity:1" fill="#121213" d="M 532.5,399.5 C 534.785,400.957 536.618,402.957 538,405.5C 558.128,439.674 567.795,476.674 567,516.5C 559.389,554.71 538.389,583.043 504,601.5C 503.228,601.355 502.561,601.022 502,600.5C 487.745,578.104 476.745,554.104 469,528.5C 460.963,484.465 473.463,447.631 506.5,418C 514.812,411.164 523.479,404.998 532.5,399.5 Z"/></g>
11
+ <g><path style="opacity:1" fill="#131314" d="M 311.5,637.5 C 309.735,638.461 307.735,638.795 305.5,638.5C 274.734,636.187 246.067,627.354 219.5,612C 194.767,595.268 177.601,572.768 168,544.5C 163.037,525.382 163.37,506.382 169,487.5C 170.258,485.236 171.425,482.902 172.5,480.5C 208.43,542.014 254.763,594.347 311.5,637.5 Z"/></g>
12
+ <g><path style="opacity:1" fill="#444446" d="M 599.5,626.5 C 604.59,628.144 609.923,629.144 615.5,629.5C 609.833,629.5 604.167,629.5 598.5,629.5C 598.263,628.209 598.596,627.209 599.5,626.5 Z"/></g>
13
+ <g><path style="opacity:1" fill="#656568" d="M 311.5,637.5 C 312.756,637.461 313.756,637.961 314.5,639C 311.304,639.805 308.304,639.638 305.5,638.5C 307.735,638.795 309.735,638.461 311.5,637.5 Z"/></g>
14
+ <g><path style="opacity:1" fill="#47484a" d="M 873.5,648.5 C 874.924,650.515 875.59,652.848 875.5,655.5C 874.076,653.485 873.41,651.152 873.5,648.5 Z"/></g>
15
+ <g><path style="opacity:1" fill="#787879" d="M 883.5,716.5 C 884.461,718.265 884.795,720.265 884.5,722.5C 891.167,722.5 897.833,722.5 904.5,722.5C 897.687,723.491 890.687,723.825 883.5,723.5C 883.5,721.167 883.5,718.833 883.5,716.5 Z"/></g>
16
+ </svg>
package/src/templates/base/public/index.html CHANGED
@@ -2,10 +2,11 @@
2
2
  <html lang="en">
3
3
  <head>
4
4
  <meta charset="UTF-8" />
5
+ <link rel="icon" type="image/png" href="/favicon.ico" />
5
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
- <title>__PROJECT_NAME__</title>
7
+ <title>artello</title>
7
8
  </head>
8
9
  <body>
9
10
  <div id="root"></div>
10
11
  </body>
11
- </html>
12
+ </html>
package/src/templates/base/src/app/App.tsx CHANGED
@@ -1,11 +1,17 @@
1
+ import Logo from '../../public/create-alistt69-kit-logo.svg';
1
2
  import styles from './styles.module.scss';
2
3
 
3
4
  function App() {
4
5
  return (
5
6
  <div className={styles.app_wrapper}>
6
- alistt69
7
+ <div className={styles.created_by_section}>
8
+ <Logo className={styles.logo} />
9
+ <p className={styles.promo}>
10
+ created by create-alistt69-kit
11
+ </p>
12
+ </div>
7
13
  </div>
8
- )
14
+ );
9
15
  }
10
16
 
11
17
  export default App;
package/src/templates/base/src/app/styles.module.scss CHANGED
@@ -1,3 +1,27 @@
1
1
  .app_wrapper {
2
+ height: 90vh;
3
+ width: 100vw;
4
+ display: flex;
5
+ align-items: center;
6
+ justify-content: center;
7
+ flex-direction: column;
2
8
 
9
+ .created_by_section {
10
+ position: relative;
11
+ height: 270px;
12
+ width: 210px;
13
+
14
+ .logo {
15
+ top: -360px;
16
+ right: 50%;
17
+ left: 50%;
18
+ transform: translateX(-50%) scale(0.19);
19
+ position: absolute;
20
+ }
21
+
22
+ .promo {
23
+ position: absolute;
24
+ bottom: 0;
25
+ }
26
+ }
3
27
  }
package/src/templates/base/src/styles/index.scss CHANGED
@@ -1,11 +1,13 @@
1
1
  html,
2
2
  body,
3
3
  #root {
4
- margin: 0;
5
- padding: 0;
6
- min-height: 100%;
4
+ margin: 0;
5
+ padding: 0;
6
+ min-height: 100%;
7
7
  }
8
8
 
9
9
  body {
10
- font-family: Arial, sans-serif;
11
- }
10
+ font-family: Bahnschrift;
11
+ background: #141617;
12
+ color: #A6A8AAFF;
13
+ }