feat(examples): add rspack

unplugin · Jul 24, 2024 · 50caf2b · 50caf2b
1 parent d9643c3
commit 50caf2b
Show file tree

Hide file tree

Showing 11 changed files with 783 additions and 13 deletions.
diff --git a/.npmrc b/.npmrc
@@ -0,0 +1 @@
+shell-emulator = true
diff --git a/examples/rspack/package.json b/examples/rspack/package.json
@@ -0,0 +1,20 @@
+{
+  "private": true,
+  "author": "三咲智子 <sxzz@sxzz.moe>",
+  "scripts": {
+    "serve": "MODE=development rspack serve",
+    "build": "rimraf dist && MODE=production rspack build",
+    "preview": "serve dist"
+  },
+  "dependencies": {
+    "vue": "^3.4.33"
+  },
+  "devDependencies": {
+    "@rspack/cli": "1.0.0-alpha.1",
+    "@rspack/core": "1.0.0-alpha.1",
+    "serve": "^14.2.3",
+    "swc-loader": "^0.2.6",
+    "ts-node": "^10.9.2",
+    "unplugin-vue": "workspace:*"
+  }
+}
diff --git a/examples/rspack/public/index.html b/examples/rspack/public/index.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Webpack</title>
+  </head>
+  <body>
+    <div id="app"></div>
+  </body>
+</html>
diff --git a/examples/rspack/rspack.config.js b/examples/rspack/rspack.config.js
@@ -0,0 +1,29 @@
+const process = require('node:process')
+const rspack = require('@rspack/core')
+const Vue = require('unplugin-vue/rspack')
+
+/** @type {import('@rspack/core').Configuration} */
+const config = {
+  mode: process.env.MODE ?? 'development',
+  entry: {
+    app: './src/main.ts',
+  },
+  module: {
+    rules: [
+      {
+        enforce: 'post',
+        test: /\.m?ts$/,
+        exclude: /(node_modules)/,
+        use: { loader: 'swc-loader' },
+      },
+    ],
+  },
+  plugins: [
+    Vue(),
+    new rspack.HtmlRspackPlugin({
+      filename: 'index.html',
+      template: 'public/index.html',
+    }),
+  ],
+}
+module.exports = config
diff --git a/examples/rspack/src/App.vue b/examples/rspack/src/App.vue
@@ -0,0 +1,12 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+const msg = ref('')
+</script>
+
+<template>
+  <div>
+    <h1>Hello world</h1>
+    <h2>{{ msg }}</h2>
+    <input v-model="msg" type="text" />
+  </div>
+</template>
diff --git a/examples/rspack/src/main.ts b/examples/rspack/src/main.ts
@@ -0,0 +1,4 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+
+createApp(App).mount('#app')
diff --git a/examples/rspack/tsconfig.json b/examples/rspack/tsconfig.json
@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "module": "esnext",
+    "moduleResolution": "bundler"
+  },
+  "include": ["src/**/*", "*"],
+  "exclude": ["node_modules"]
+}
diff --git a/examples/webpack/package.json b/examples/webpack/package.json
@@ -2,8 +2,8 @@
   "private": true,
   "author": "三咲智子 <sxzz@sxzz.moe>",
   "scripts": {
-    "serve": "cross-env MODE=development webpack serve",
-    "build": "rimraf dist && cross-env MODE=production webpack build",
+    "serve": "MODE=development webpack serve",
+    "build": "rimraf dist && MODE=production webpack build",
     "preview": "serve dist"
   },
   "dependencies": {
@@ -12,7 +12,6 @@
   "devDependencies": {
     "@swc/core": "^1.7.0",
     "@types/webpack": "^5.28.5",
-    "cross-env": "^7.0.3",
     "html-webpack-plugin": "^5.6.0",
     "serve": "^14.2.3",
     "sucrase": "^3.35.0",

diff --git a/package.json b/package.json
@@ -43,6 +43,10 @@
       "require": "./dist/webpack.cjs",
       "import": "./dist/webpack.js"
     },
+    "./rspack": {
+      "require": "./dist/rspack.cjs",
+      "import": "./dist/rspack.js"
+    },
     "./rollup": {
       "require": "./dist/rollup.cjs",
       "import": "./dist/rollup.js"