create-rspack 1.0.0-alpha.4 → 1.0.0-beta.0

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/index.js CHANGED
@@ -1,8 +1,8 @@
1
1
  #!/usr/bin/env node
2
2
  const yargs = require("yargs/yargs");
3
3
  const { hideBin } = require("yargs/helpers");
4
- const fs = require("fs");
5
- const path = require("path");
4
+ const fs = require("node:fs");
5
+ const path = require("node:path");
6
6
  const prompts = require("prompts");
7
7
  const { formatTargetDir } = require("./utils");
8
8
  const { version } = require("./package.json");
@@ -57,6 +57,8 @@ yargs(hideBin(process.argv))
57
57
  name: "template",
58
58
  message: "Project template",
59
59
  choices: [
60
+ { title: "vanilla", value: "vanilla" },
61
+ { title: "vanilla-ts", value: "vanilla-ts" },
60
62
  { title: "react", value: "react" },
61
63
  { title: "react-ts", value: "react-ts" },
62
64
  { title: "vue", value: "vue" },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-rspack",
3
- "version": "1.0.0-alpha.4",
3
+ "version": "1.0.0-beta.0",
4
4
  "license": "MIT",
5
5
  "main": "index.js",
6
6
  "bin": {
@@ -1,24 +1,13 @@
1
- # Logs
2
- logs
3
- *.log
4
- npm-debug.log*
5
- yarn-debug.log*
6
- yarn-error.log*
7
- pnpm-debug.log*
8
- lerna-debug.log*
1
+ # Local
2
+ .DS_Store
3
+ *.local
4
+ *.log*
9
5
 
6
+ # Dist
10
7
  node_modules
11
- dist
12
- dist-ssr
13
- *.local
8
+ dist/
14
9
 
15
- # Editor directories and files
10
+ # IDE
16
11
  .vscode/*
17
12
  !.vscode/extensions.json
18
13
  .idea
19
- .DS_Store
20
- *.suo
21
- *.ntvs*
22
- *.njsproj
23
- *.sln
24
- *.sw?
@@ -1,5 +1,5 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
1
+ <!doctype html>
2
+ <html>
3
3
  <head>
4
4
  <meta charset="UTF-8" />
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -15,7 +15,7 @@ function App() {
15
15
  </div>
16
16
  <h1>Rspack + React</h1>
17
17
  <div className="card">
18
- <button onClick={() => setCount(count => count + 1)}>
18
+ <button type="button" onClick={() => setCount(count => count + 1)}>
19
19
  count is {count}
20
20
  </button>
21
21
  <p>
@@ -1,24 +1,13 @@
1
- # Logs
2
- logs
3
- *.log
4
- npm-debug.log*
5
- yarn-debug.log*
6
- yarn-error.log*
7
- pnpm-debug.log*
8
- lerna-debug.log*
1
+ # Local
2
+ .DS_Store
3
+ *.local
4
+ *.log*
9
5
 
6
+ # Dist
10
7
  node_modules
11
- dist
12
- dist-ssr
13
- *.local
8
+ dist/
14
9
 
15
- # Editor directories and files
10
+ # IDE
16
11
  .vscode/*
17
12
  !.vscode/extensions.json
18
13
  .idea
19
- .DS_Store
20
- *.suo
21
- *.ntvs*
22
- *.njsproj
23
- *.sln
24
- *.sw?
@@ -1,5 +1,5 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
1
+ <!doctype html>
2
+ <html>
3
3
  <head>
4
4
  <meta charset="UTF-8" />
5
5
  <link rel="icon" type="image/svg+xml" href="/react.svg" />
@@ -14,7 +14,7 @@ function App() {
14
14
  </div>
15
15
  <h1>Rspack + React + TypeScript</h1>
16
16
  <div className="card">
17
- <button onClick={() => setCount(count => count + 1)}>
17
+ <button type="button" onClick={() => setCount(count => count + 1)}>
18
18
  count is {count}
19
19
  </button>
20
20
  <p>
@@ -1,24 +1,13 @@
1
- # Logs
2
- logs
3
- *.log
4
- npm-debug.log*
5
- yarn-debug.log*
6
- yarn-error.log*
7
- pnpm-debug.log*
8
- lerna-debug.log*
1
+ # Local
2
+ .DS_Store
3
+ *.local
4
+ *.log*
9
5
 
6
+ # Dist
10
7
  node_modules
11
- dist
12
- dist-ssr
13
- *.local
8
+ dist/
14
9
 
15
- # Editor directories and files
10
+ # IDE
16
11
  .vscode/*
17
12
  !.vscode/extensions.json
18
13
  .idea
19
- .DS_Store
20
- *.suo
21
- *.ntvs*
22
- *.njsproj
23
- *.sln
24
- *.sw?
@@ -1,5 +1,5 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
1
+ <!doctype html>
2
+ <html>
3
3
  <head>
4
4
  <meta charset="UTF-8" />
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -7,7 +7,6 @@
7
7
  "build": "cross-env NODE_ENV=production rspack build"
8
8
  },
9
9
  "devDependencies": {
10
- "browserify": "latest",
11
10
  "cross-env": "^7.0.3",
12
11
  "@rspack/cli": "workspace:*",
13
12
  "@rspack/core": "workspace:*"
@@ -1,9 +1,38 @@
1
1
  import { defineConfig } from "@rspack/cli";
2
2
  import { rspack } from "@rspack/core";
3
3
 
4
+ const targets = ["chrome >= 87", "edge >= 88", "firefox >= 78", "safari >= 14"];
5
+
4
6
  export default defineConfig({
5
7
  entry: {
6
8
  main: "./src/index.js"
7
9
  },
8
- plugins: [new rspack.HtmlRspackPlugin({ template: "./index.html" })]
10
+ module: {
11
+ rules: [
12
+ {
13
+ test: /\.svg$/,
14
+ type: "asset"
15
+ },
16
+ {
17
+ test: /\.js$/,
18
+ use: [
19
+ {
20
+ loader: "builtin:swc-loader",
21
+ options: {
22
+ jsc: {
23
+ parser: {
24
+ syntax: "ecmascript"
25
+ }
26
+ },
27
+ env: { targets }
28
+ }
29
+ }
30
+ ]
31
+ }
32
+ ]
33
+ },
34
+ plugins: [new rspack.HtmlRspackPlugin({ template: "./index.html" })],
35
+ experiments: {
36
+ css: true
37
+ }
9
38
  });
@@ -0,0 +1,26 @@
1
+ body {
2
+ margin: 0;
3
+ color: #fff;
4
+ font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
5
+ background-image: linear-gradient(to bottom, #020917, #101725);
6
+ }
7
+
8
+ .content {
9
+ display: flex;
10
+ min-height: 100vh;
11
+ line-height: 1.1;
12
+ text-align: center;
13
+ flex-direction: column;
14
+ justify-content: center;
15
+ }
16
+
17
+ .content h1 {
18
+ font-size: 3.6rem;
19
+ font-weight: 700;
20
+ }
21
+
22
+ .content p {
23
+ font-size: 1.2rem;
24
+ font-weight: 400;
25
+ opacity: 0.5;
26
+ }
@@ -1,7 +1,8 @@
1
- import { message } from "./message";
2
- function render() {
3
- const container = document.getElementById("root");
4
- console.log({ container });
5
- container.innerHTML = `Hello ${message}`;
6
- }
7
- render();
1
+ import "./index.css";
2
+
3
+ document.querySelector("#root").innerHTML = `
4
+ <div class="content">
5
+ <h1>Vanilla Rspack</h1>
6
+ <p>Start building amazing things with Rspack.</p>
7
+ </div>
8
+ `;
@@ -0,0 +1,13 @@
1
+ # Local
2
+ .DS_Store
3
+ *.local
4
+ *.log*
5
+
6
+ # Dist
7
+ node_modules
8
+ dist/
9
+
10
+ # IDE
11
+ .vscode/*
12
+ !.vscode/extensions.json
13
+ .idea
@@ -0,0 +1,11 @@
1
+ <!doctype html>
2
+ <html>
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Rspack</title>
7
+ </head>
8
+ <body>
9
+ <div id="root"></div>
10
+ </body>
11
+ </html>
@@ -0,0 +1,16 @@
1
+ {
2
+ "name": "rspack-vanilla-ts-starter",
3
+ "private": true,
4
+ "version": "1.0.0",
5
+ "scripts": {
6
+ "dev": "cross-env NODE_ENV=development rspack serve",
7
+ "build": "cross-env NODE_ENV=production rspack build"
8
+ },
9
+ "devDependencies": {
10
+ "cross-env": "^7.0.3",
11
+ "@rspack/cli": "workspace:*",
12
+ "@rspack/core": "workspace:*",
13
+ "ts-node": "^10.9.2",
14
+ "typescript": "^5.3.3"
15
+ }
16
+ }
@@ -0,0 +1,57 @@
1
+ import { defineConfig } from "@rspack/cli";
2
+ import { rspack } from "@rspack/core";
3
+
4
+ const targets = ["chrome >= 87", "edge >= 88", "firefox >= 78", "safari >= 14"];
5
+
6
+ export default defineConfig({
7
+ entry: {
8
+ main: "./src/index.ts"
9
+ },
10
+ resolve: {
11
+ extensions: ["...", ".ts"]
12
+ },
13
+ module: {
14
+ rules: [
15
+ {
16
+ test: /\.svg$/,
17
+ type: "asset"
18
+ },
19
+ {
20
+ test: /\.js$/,
21
+ use: [
22
+ {
23
+ loader: "builtin:swc-loader",
24
+ options: {
25
+ jsc: {
26
+ parser: {
27
+ syntax: "ecmascript"
28
+ }
29
+ },
30
+ env: { targets }
31
+ }
32
+ }
33
+ ]
34
+ },
35
+ {
36
+ test: /\.ts$/,
37
+ use: [
38
+ {
39
+ loader: "builtin:swc-loader",
40
+ options: {
41
+ jsc: {
42
+ parser: {
43
+ syntax: "typescript"
44
+ }
45
+ },
46
+ env: { targets }
47
+ }
48
+ }
49
+ ]
50
+ }
51
+ ]
52
+ },
53
+ plugins: [new rspack.HtmlRspackPlugin({ template: "./index.html" })],
54
+ experiments: {
55
+ css: true
56
+ }
57
+ });
@@ -0,0 +1,26 @@
1
+ body {
2
+ margin: 0;
3
+ color: #fff;
4
+ font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
5
+ background-image: linear-gradient(to bottom, #020917, #101725);
6
+ }
7
+
8
+ .content {
9
+ display: flex;
10
+ min-height: 100vh;
11
+ line-height: 1.1;
12
+ text-align: center;
13
+ flex-direction: column;
14
+ justify-content: center;
15
+ }
16
+
17
+ .content h1 {
18
+ font-size: 3.6rem;
19
+ font-weight: 700;
20
+ }
21
+
22
+ .content p {
23
+ font-size: 1.2rem;
24
+ font-weight: 400;
25
+ opacity: 0.5;
26
+ }
@@ -0,0 +1,8 @@
1
+ import "./index.css";
2
+
3
+ document.querySelector("#root")!.innerHTML = `
4
+ <div class="content">
5
+ <h1>Vanilla Rspack</h1>
6
+ <p>Start building amazing things with Rspack.</p>
7
+ </div>
8
+ `;
@@ -1,24 +1,13 @@
1
- # Logs
2
- logs
3
- *.log
4
- npm-debug.log*
5
- yarn-debug.log*
6
- yarn-error.log*
7
- pnpm-debug.log*
8
- lerna-debug.log*
1
+ # Local
2
+ .DS_Store
3
+ *.local
4
+ *.log*
9
5
 
6
+ # Dist
10
7
  node_modules
11
- dist
12
- dist-ssr
13
- *.local
8
+ dist/
14
9
 
15
- # Editor directories and files
10
+ # IDE
16
11
  .vscode/*
17
12
  !.vscode/extensions.json
18
13
  .idea
19
- .DS_Store
20
- *.suo
21
- *.ntvs*
22
- *.njsproj
23
- *.sln
24
- *.sw?
@@ -1,12 +1,11 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <title>Vue</title>
8
- </head>
9
- <body>
10
- <div id="app"></div>
11
- </body>
12
- </html>
1
+ <!doctype html>
2
+ <html>
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Vue</title>
7
+ </head>
8
+ <body>
9
+ <div id="app"></div>
10
+ </body>
11
+ </html>
@@ -7,12 +7,12 @@
7
7
  "build": "cross-env NODE_ENV=production rspack build"
8
8
  },
9
9
  "dependencies": {
10
- "vue": "3.2.45"
10
+ "vue": "^3.4.21"
11
11
  },
12
12
  "devDependencies": {
13
13
  "@rspack/cli": "workspace:*",
14
14
  "@rspack/core": "workspace:*",
15
15
  "cross-env": "^7.0.3",
16
- "vue-loader": "^17.2.2"
16
+ "vue-loader": "^17.3.1"
17
17
  }
18
18
  }
@@ -1,24 +1,13 @@
1
- # Logs
2
- logs
3
- *.log
4
- npm-debug.log*
5
- yarn-debug.log*
6
- yarn-error.log*
7
- pnpm-debug.log*
8
- lerna-debug.log*
1
+ # Local
2
+ .DS_Store
3
+ *.local
4
+ *.log*
9
5
 
6
+ # Dist
10
7
  node_modules
11
- dist
12
- dist-ssr
13
- *.local
8
+ dist/
14
9
 
15
- # Editor directories and files
10
+ # IDE
16
11
  .vscode/*
17
12
  !.vscode/extensions.json
18
13
  .idea
19
- .DS_Store
20
- *.suo
21
- *.ntvs*
22
- *.njsproj
23
- *.sln
24
- *.sw?
@@ -1,12 +1,11 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <title>Vue</title>
8
- </head>
9
- <body>
10
- <div id="app"></div>
11
- </body>
12
- </html>
1
+ <!doctype html>
2
+ <html>
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Vue</title>
7
+ </head>
8
+ <body>
9
+ <div id="app"></div>
10
+ </body>
11
+ </html>
@@ -7,7 +7,7 @@
7
7
  "build": "cross-env NODE_ENV=production rspack build"
8
8
  },
9
9
  "dependencies": {
10
- "vue": "3.4.21"
10
+ "vue": "^3.4.21"
11
11
  },
12
12
  "devDependencies": {
13
13
  "@rspack/cli": "workspace:*",
@@ -15,6 +15,6 @@
15
15
  "cross-env": "^7.0.3",
16
16
  "ts-node": "^10.9.2",
17
17
  "typescript": "^5.3.3",
18
- "vue-loader": "^17.2.2"
18
+ "vue-loader": "^17.3.1"
19
19
  }
20
20
  }
@@ -1 +0,0 @@
1
- export const message = "Rspack";