@rspack/core 0.0.1 → 0.0.2

package/CHANGELOG.md

@@ -0,0 +1,11 @@
+# @rspack/core
+
+## 0.0.2
+
+### Patch Changes
+
+- bd57e818: first release
+- Updated dependencies [bd57e818]
+  - @rspack/binding@0.0.2
+  - rspack-dev-server@0.0.2
+  - rspack-plugin-postcss@0.0.2

package/README.md

@@ -0,0 +1 @@
+# rspack

package/bin.js

@@ -0,0 +1 @@
+require("./dist/bin/index");

package/dist/bin/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/bin/index.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const commander_1 = require("commander");
+const rspack_dev_server_1 = require("rspack-dev-server");
+const __1 = require("..");
+const build_1 = require("../build");
+const program = new commander_1.Command();
+program
+    .option("--env", "env")
+    .command("build", {
+    isDefault: true
+})
+    .description("Rspack build cli")
+    .argument("<config-file>", "rspack config  file path")
+    .action(async (configPath) => {
+    const config = require(configPath);
+    const stats = await (0, build_1.build)(config);
+    console.log(stats);
+});
+program
+    .command("dev")
+    .description("Rspack build cli")
+    .argument("<config-file>", "rspack config file path")
+    .action(async (configPath) => {
+    const config = require(configPath);
+    const rspack = new __1.Rspack(config);
+    const { options: { dev: { port = 8080 } = {} } = {} } = rspack;
+    await rspack.build();
+    const server = await (0, rspack_dev_server_1.createServer)(rspack.options);
+    server.listen(port, () => console.log(`Server listening on port: ${port}`));
+});
+program.parse();

package/dist/build.d.ts

@@ -0,0 +1 @@
+export declare function build(config: any): Promise<void>;

package/dist/build.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.build = void 0;
+const _1 = require(".");
+async function build(config) {
+    const rspack = new _1.Rspack(config);
+    const stats = await rspack.build();
+    if (stats.errors.length > 0) {
+        throw new Error(stats.errors[0].message);
+    }
+}
+exports.build = build;

package/dist/config.d.ts

@@ -0,0 +1,43 @@
+import type { RawOptions } from "@rspack/binding";
+import type { ModuleRule } from ".";
+export declare type Plugin = {
+    name: string;
+    done?: () => void | Promise<void>;
+};
+export interface RspackOptions {
+    /**
+     * Entry points of compilation.
+     */
+    entry?: RawOptions["entry"];
+    /**
+     * An **absolute** path pointed the
+     */
+    context?: RawOptions["context"];
+    /**
+     * An array of plugins
+     */
+    plugins?: Plugin[];
+    /**
+     * dev server
+     */
+    dev?: {
+        port?: Number;
+        static?: {
+            directory?: string;
+        };
+    };
+    /**
+     * Module configuration.
+     */
+    module?: {
+        rules?: ModuleRule[];
+        parser?: RawOptions["module"]["parser"];
+    };
+    define?: RawOptions["define"];
+    target?: RawOptions["target"];
+    mode?: RawOptions["mode"];
+    external?: RawOptions["external"];
+}
+export declare function User2Native(config: RspackOptions): RawOptions & {
+    plugins: Plugin[];
+};

package/dist/config.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.User2Native = void 0;
+const _1 = require(".");
+function User2Native(config) {
+    var _a, _b, _c, _d;
+    return {
+        entry: (_a = config.entry) !== null && _a !== void 0 ? _a : {},
+        context: config.context,
+        define: config.define,
+        target: config.target,
+        external: config.external,
+        plugins: (_b = config.plugins) !== null && _b !== void 0 ? _b : [],
+        module: {
+            // TODO: support mutliple rules to support `Module Type`
+            rules: ((_d = (_c = config === null || config === void 0 ? void 0 : config.module) === null || _c === void 0 ? void 0 : _c.rules) !== null && _d !== void 0 ? _d : []).map(rule => {
+                return {
+                    ...rule,
+                    uses: (0, _1.createRawModuleRuleUses)(rule.uses || [])
+                };
+            })
+        }
+    };
+}
+exports.User2Native = User2Native;

package/dist/index.d.ts

@@ -0,0 +1,52 @@
+/// <reference types="node" />
+export * from "./build";
+import * as binding from "@rspack/binding";
+import type { RawModuleRuleUse, RawModuleRule } from "@rspack/binding";
+import type { RspackOptions } from "./config";
+interface ModuleRule {
+    test?: RawModuleRule["test"];
+    resource?: RawModuleRule["resource"];
+    resourceQuery?: RawModuleRule["resourceQuery"];
+    uses?: ModuleRuleUse[];
+    type?: RawModuleRule["type"];
+}
+declare type ModuleRuleUse = {
+    builtinLoader: BuiltinLoader;
+    options?: unknown;
+} | {
+    loader: JsLoader;
+    options?: unknown;
+};
+interface JsLoader {
+    (this: LoaderContext, loaderContext: LoaderContext): Promise<LoaderResult | void> | LoaderResult | void;
+    displayName?: string;
+}
+declare type BuiltinLoader = string;
+interface LoaderContextInternal {
+    source: number[];
+    resource: String;
+    resourcePath: String;
+    resourceQuery: String | null;
+    resourceFragment: String | null;
+}
+interface LoaderContext extends Pick<LoaderContextInternal, "resource" | "resourcePath" | "resourceQuery" | "resourceFragment"> {
+    source: {
+        getCode(): string;
+        getBuffer(): Buffer;
+    };
+}
+interface LoaderResult {
+    content: Buffer | string;
+    meta: Buffer | string;
+}
+declare function createRawModuleRuleUses(uses: ModuleRuleUse[]): RawModuleRuleUse[];
+declare class Rspack {
+    #private;
+    options: RspackOptions;
+    constructor(options: RspackOptions);
+    build(): Promise<binding.Stats>;
+    rebuild(): Promise<Record<string, string>>;
+}
+export { Rspack, createRawModuleRuleUses };
+export type { ModuleRule };
+export default Rspack;

package/dist/index.js

@@ -0,0 +1,184 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+var _Rspack_instances, _Rspack_instance, _Rspack_plugins, _Rspack_done;
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createRawModuleRuleUses = exports.Rspack = void 0;
+__exportStar(require("./build"), exports);
+const binding = __importStar(require("@rspack/binding"));
+const node_assert_1 = __importDefault(require("node:assert"));
+const Config = __importStar(require("./config"));
+const toBuffer = (bufLike) => {
+    if (Buffer.isBuffer(bufLike)) {
+        return bufLike;
+    }
+    else if (typeof bufLike === "string") {
+        return Buffer.from(bufLike);
+    }
+    throw new Error("Buffer or string expected");
+};
+function createRawModuleRuleUses(uses) {
+    return createRawModuleRuleUsesImpl([...uses].reverse());
+}
+exports.createRawModuleRuleUses = createRawModuleRuleUses;
+function createRawModuleRuleUsesImpl(uses) {
+    const index = uses.findIndex(use => "builtinLoader" in use);
+    if (index < 0) {
+        return [composeJsUse(uses)];
+    }
+    const before = uses.slice(0, index);
+    const after = uses.slice(index + 1);
+    return [
+        composeJsUse(before),
+        createNativeUse(uses[index]),
+        ...createRawModuleRuleUsesImpl(after)
+    ];
+}
+function createNativeUse(use) {
+    var _a;
+    (0, node_assert_1.default)("builtinLoader" in use);
+    if (use.builtinLoader === "sass-loader") {
+        ((_a = use.options) !== null && _a !== void 0 ? _a : (use.options = {})).__exePath = require.resolve(`@tmp-sass-embedded/${process.platform}-${process.arch}/dart-sass-embedded/dart-sass-embedded${process.platform === "win32" ? ".bat" : ""}`);
+    }
+    return {
+        builtinLoader: use.builtinLoader,
+        options: JSON.stringify(use.options)
+    };
+}
+function composeJsUse(uses) {
+    async function loader(err, data) {
+        if (err) {
+            throw err;
+        }
+        const loaderThreadsafeContext = JSON.parse(data.toString("utf-8"));
+        const { p: payload, id } = loaderThreadsafeContext;
+        const loaderContextInternal = {
+            source: payload.source,
+            resourcePath: payload.resourcePath,
+            resourceQuery: payload.resourceQuery,
+            resource: payload.resource,
+            resourceFragment: payload.resourceFragment
+        };
+        let sourceBuffer = Buffer.from(loaderContextInternal.source);
+        let meta = Buffer.from("");
+        // Loader is executed from right to left
+        for (const use of uses) {
+            (0, node_assert_1.default)("loader" in use);
+            const loaderContext = {
+                ...loaderContextInternal,
+                source: {
+                    getCode() {
+                        return sourceBuffer.toString("utf-8");
+                    },
+                    getBuffer() {
+                        return sourceBuffer;
+                    }
+                },
+                getOptions() {
+                    return use.options;
+                }
+            };
+            let loaderResult;
+            if ((loaderResult = await Promise.resolve().then(() => use.loader.apply(loaderContext, [loaderContext])))) {
+                const content = loaderResult.content;
+                meta = meta.length > 0 ? meta : toBuffer(loaderResult.meta);
+                sourceBuffer = toBuffer(content);
+            }
+        }
+        const loaderResultPayload = {
+            content: [...sourceBuffer],
+            meta: [...meta]
+        };
+        const loaderThreadsafeResult = {
+            id: id,
+            p: loaderResultPayload
+        };
+        return Buffer.from(JSON.stringify(loaderThreadsafeResult), "utf-8");
+    }
+    loader.displayName = `NodeLoaderAdapter(${uses
+        .map(item => {
+        (0, node_assert_1.default)("loader" in item);
+        return item.loader.displayName || item.loader.name || "unknown-loader";
+    })
+        .join(" -> ")})`;
+    return {
+        loader
+    };
+}
+const createDummyResult = (id) => {
+    const result = {
+        id,
+        inner: null
+    };
+    return JSON.stringify(result);
+};
+class Rspack {
+    constructor(options) {
+        var _a;
+        this.options = options;
+        _Rspack_instances.add(this);
+        _Rspack_instance.set(this, void 0);
+        _Rspack_plugins.set(this, void 0);
+        const nativeConfig = Config.User2Native(options);
+        __classPrivateFieldSet(this, _Rspack_plugins, (_a = options.plugins) !== null && _a !== void 0 ? _a : [], "f");
+        __classPrivateFieldSet(this, _Rspack_instance, binding.newRspack(nativeConfig, {
+            doneCallback: __classPrivateFieldGet(this, _Rspack_instances, "m", _Rspack_done).bind(this)
+        }), "f");
+    }
+    async build() {
+        const stats = await binding.build(__classPrivateFieldGet(this, _Rspack_instance, "f"));
+        return stats;
+    }
+    async rebuild() {
+        const stats = await binding.rebuild(__classPrivateFieldGet(this, _Rspack_instance, "f"));
+        return stats;
+    }
+}
+exports.Rspack = Rspack;
+_Rspack_instance = new WeakMap(), _Rspack_plugins = new WeakMap(), _Rspack_instances = new WeakSet(), _Rspack_done = async function _Rspack_done(err, value) {
+    var _a;
+    const context = JSON.parse(value);
+    for (const plugin of __classPrivateFieldGet(this, _Rspack_plugins, "f")) {
+        await ((_a = plugin.done) === null || _a === void 0 ? void 0 : _a.call(plugin));
+    }
+    return createDummyResult(context.id);
+};
+exports.default = Rspack;

package/example/basic.ts

@@ -0,0 +1,43 @@
+import path from "path";
+import postcssLoader from "rspack-plugin-postcss";
+import { Rspack } from "../src";
+
+const rspack = new Rspack({
+	entry: {
+		main: path.resolve(__dirname, "../../../examples/postcss/index.js")
+	},
+	context: path.resolve(__dirname, "../../../examples/postcss"),
+	plugins: ["html"],
+	module: {
+		rules: [
+			{
+				test: ".module.css$",
+				uses: [
+					{
+						loader: postcssLoader,
+						options: {
+							modules: true
+						}
+					}
+					// {
+					// 	loader: function testLoader(loaderContext) {
+					// 		// console.log(loaderContext);
+					// 		return {
+					// 			content: loaderContext.source.getBufFer(),
+					// 			meta: Buffer.from("something")
+					// 		};
+					// 	}
+					// }
+				]
+			}
+		]
+	}
+});
+
+async function main() {
+	const stats = await rspack.build();
+	console.log(stats);
+	// assert(stats.assets.length > 0)
+}
+
+main();

package/example/react-example/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>Document</title>
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>

package/example/react-example/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "react-example",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "dev": "rspack dev rspack.config.json"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "@rspack/core": "workspace:*",
+    "react": "17.0.0",
+    "react-dom": "17.0.0"
+  }
+}

package/example/react-example/rspack.config.json

@@ -0,0 +1,13 @@
+{
+  "mode": "development",
+  "entry": {
+    "main": "./src/index.js"
+  },
+  "dev": {
+    "port": 8081,
+    "static": {
+      "directory": "dist"
+    }
+  },
+  "plugins": ["html"]
+}

package/example/react-example/src/app.jsx

@@ -0,0 +1,44 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import './base.css';
+import LogoJPG from './file.jpg';
+import LogoPNG from './file.png';
+import LogoSVG from './file.svg';
+import Json from './data.json';
+// import Dark from './dark.svg';
+// import Light from './light.svg'
+// import LogoUrl from './logo.svg'
+// import Logo from './logo.svg'
+// const Button = React.lazy(() => import('../src/button'))
+
+// console.log('LogoUrl', LogoUrl)
+// console.log('Logo', Logo)
+
+const App = () => {
+  return (
+    <React.Suspense fallback={<div>loading...</div>}>
+      <div>hello world</div>
+      {/* <Button></Button> */}
+
+      <img
+        style={{ width: '40px', height: '40px' }}
+        src={LogoJPG}
+        alt="logo jpg"
+      />
+      <img
+        style={{ width: '40px', height: '40px' }}
+        src={LogoPNG}
+        alt="logo png"
+      />
+      <img
+        style={{ width: '40px', height: '40px' }}
+        src={LogoSVG}
+        alt="logo svg"
+      />
+      {/* <Logo width={'40px'} height={'40px'} />
+      <Light width={'40px'} height={'40px'} />
+      <Dark width={'40px'} height={'40px'} /> */}
+    </React.Suspense>
+  );
+};
+ReactDOM.render(<App />, document.getElementById('root'));

package/example/react-example/src/base.css

@@ -0,0 +1,9 @@
+@import './foo.css';
+
+body {
+  background: gray;
+  background-image: url('./logo.svg');
+}
+.class {
+  box-shadow: 10px 5px 5px red;
+}

package/example/react-example/src/button.jsx

@@ -0,0 +1,3 @@
+import React from 'react'
+const button = () => <div>cute button</div>
+export default button

package/example/react-example/src/dark.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1599669065723" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18411" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css"></style></defs><path d="M390 250c0-52.6 10.6-102.6 29.8-148.2C237.4 146 102 310.2 102 506c0 229.6 186.4 416 416 416 195.8 0 360-135.4 404.2-317.8-45.6 19.2-95.8 29.8-148.2 29.8-212 0-384-172-384-384z" p-id="18412"></path></svg>

package/example/react-example/src/data.json

@@ -0,0 +1,5 @@
+{
+  "escaped": "\\u2028",
+  "LS": "
",
+  "PS": "
"
+}

package/example/react-example/src/file.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 600 600"><title>icon-square-small</title><path fill="#FFF" d="M300 .1L565 150v299.9L300 599.8 35 449.9V150z"/><path fill="#8ED6FB" d="M517.7 439.5L308.8 557.8v-92L439 394.1l78.7 45.4zm14.3-12.9V179.4l-76.4 44.1v159l76.4 44.1zM81.5 439.5l208.9 118.2v-92l-130.2-71.6-78.7 45.4zm-14.3-12.9V179.4l76.4 44.1v159l-76.4 44.1zm8.9-263.2L290.4 42.2v89l-137.3 75.5-1.1.6-75.9-43.9zm446.9 0L308.8 42.2v89L446 206.8l1.1.6 75.9-44z"/><path fill="#1C78C0" d="M290.4 444.8L162 374.1V234.2l128.4 74.1v136.5zm18.4 0l128.4-70.6v-140l-128.4 74.1v136.5zM299.6 303zm-129-85l129-70.9L428.5 218l-128.9 74.4-129-74.4z"/></svg>

package/example/react-example/src/foo.css

@@ -0,0 +1,3 @@
+body {
+  color: rebeccapurple;
+}

package/example/react-example/src/index.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8" />
+  <title>React App</title>
+  <script>
+    process = {
+      env: 'production'
+    }
+  </script>
+  <script src="./runtime.js"></script>
+  <link rel="stylesheet" href="./main.css">
+</head>
+
+<body>
+  <noscript>You need to enable JavaScript to run this app.</noscript>
+  <div id="root"></div>
+  <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+</body>
+<script src="./main.js"></script>
+
+</html>

package/example/react-example/src/index.js

@@ -0,0 +1 @@
+import "./app.jsx";

package/example/react-example/src/light.svg

@@ -0,0 +1,48 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	y="0px" viewBox="0 0 22 22" style="enable-background:new 0 0 22 22;" xml:space="preserve">
+	<style type="text/css">
+		.st1 {
+			fill: none;
+		}
+
+		body {
+			background: deepskyblue;
+		}
+	</style>
+	<title>编组 5备份</title>
+	<desc>Created with Sketch.</desc>
+	<g id="组件页-Web端-_xD83E__xDD1F_">
+		<g id="暗黑模式" transform="translate(2.500000, 2.500000)">
+			<g id="编组-12">
+				<g id="编组-8">
+					<g id="编组-7" transform="translate(7.285714, 0.000000)">
+					</g>
+
+					<g id="编组-7备份"
+						transform="translate(8.500000, 8.500000) rotate(-270.000000) translate(-8.500000, -8.500000) translate(7.285714, 0.000000)">
+					</g>
+
+					<g id="编组-7备份-2"
+						transform="translate(8.500000, 8.500000) rotate(-225.000000) translate(-8.500000, -8.500000) translate(7.285714, 0.000000)">
+					</g>
+
+					<g id="编组-7备份-3"
+						transform="translate(8.500000, 8.500000) rotate(-315.000000) translate(-8.500000, -8.500000) translate(7.285714, 0.000000)">
+					</g>
+				</g>
+			</g>
+			<path id="椭圆形" class="st0" d="M8.5,11.5c1.7,0,3-1.4,3-3s-1.4-3-3-3s-3,1.4-3,3S6.8,11.5,8.5,11.5z" />
+			<rect id="矩形" x="7.3" class="st0" width="2.4" height="2.4" />
+			<rect id="矩形备份-2" x="7.3" y="14.6" class="st0" width="2.4" height="2.4" />
+			<polygon id="矩形_1_" class="st0" points="17,7.3 17,9.7 14.6,9.7 14.6,7.3 		" />
+			<polygon id="矩形备份-2_1_" class="st0" points="2.4,7.3 2.4,9.7 0,9.7 0,7.3 		" />
+			<polygon id="矩形_2_" class="st0" points="15.4,13.7 13.7,15.4 11.9,13.7 13.7,11.9 		" />
+			<polygon id="矩形备份-2_2_" class="st0" points="5.1,3.3 3.3,5.1 1.6,3.3 3.3,1.6 		" />
+			<polygon id="矩形_3_" class="st0" points="13.7,1.6 15.4,3.3 13.7,5.1 11.9,3.3 		" />
+			<polygon id="矩形备份-2_3_" class="st0" points="3.3,11.9 5.1,13.7 3.3,15.4 1.6,13.7 		" />
+		</g>
+	</g>
+	<rect x="0" class="st1" width="22" height="22" />
+</svg>

package/example/react-example/src/logo.svg

@@ -0,0 +1,18 @@
+<svg width="33" height="33" viewBox="0 0 33 33" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g clip-path="url(#clip0)">
+        <path fill-rule="evenodd" clip-rule="evenodd"
+            d="M5.37754 16.9795L12.7498 9.43027C14.7163 7.41663 17.9428 7.37837 19.9564 9.34482C19.9852 9.37297 20.0137 9.40145 20.0418 9.43027L20.1221 9.51243C22.1049 11.5429 22.1049 14.7847 20.1221 16.8152L12.7498 24.3644C10.7834 26.378 7.55686 26.4163 5.54322 24.4498C5.5144 24.4217 5.48592 24.3932 5.45777 24.3644L5.37754 24.2822C3.39468 22.2518 3.39468 19.0099 5.37754 16.9795Z"
+            fill="#12D2AC" />
+        <path fill-rule="evenodd" clip-rule="evenodd"
+            d="M20.0479 9.43034L27.3399 16.8974C29.3674 18.9735 29.3674 22.2883 27.3399 24.3644C25.3735 26.3781 22.147 26.4163 20.1333 24.4499C20.1045 24.4217 20.076 24.3933 20.0479 24.3644L12.7558 16.8974C10.7284 14.8213 10.7284 11.5065 12.7558 9.43034C14.7223 7.4167 17.9488 7.37844 19.9624 9.34489C19.9912 9.37304 20.0197 9.40152 20.0479 9.43034Z"
+            fill="#307AF2" />
+        <path fill-rule="evenodd" clip-rule="evenodd"
+            d="M20.1321 9.52163L23.6851 13.1599L16.3931 20.627L9.10103 13.1599L12.6541 9.52163C14.6707 7.45664 17.9794 7.4174 20.0444 9.434C20.074 9.46286 20.1032 9.49207 20.1321 9.52163Z"
+            fill="#0057FE" />
+    </g>
+    <defs>
+        <clipPath id="clip0">
+            <rect width="26" height="19" fill="white" transform="translate(3.5 7)" />
+        </clipPath>
+    </defs>
+</svg>

package/example/react-with-sass.ts

@@ -0,0 +1,28 @@
+import path from "path";
+import { Rspack } from "../src";
+
+const context = path.resolve(__dirname, "../../../examples/react-with-sass");
+
+const rspack = new Rspack({
+	entry: {
+		main: path.resolve(context, "./src/index.jsx")
+	},
+	context,
+	plugins: ["html"],
+	module: {
+		rules: [
+			{
+				test: "\\.s[ac]ss$",
+				uses: [{ builtinLoader: "sass-loader" }],
+				type: "css"
+			}
+		]
+	}
+});
+
+async function main() {
+	const stats = await rspack.build();
+	console.log(stats);
+}
+
+main();

package/package.json

@@ -1,18 +1,34 @@
 {
   "name": "@rspack/core",
-  "version": "0.0.1",
-  "description": "",
-  "main": "index.js",
-  "publishConfig": {
-    "access": "public"
+  "main": "./dist/index.js",
+  "version": "0.0.2",
+  "bin": {
+    "rspack": "./bin.js"
   },
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+  "types": "./dist/index.d.ts",
+  "devDependencies": {
+    "@types/node": "^18.6.3",
+    "tsm": "^2.2.2",
+    "typescript": "4.7.3"
   },
-  "keywords": [],
-  "author": "",
-  "license": "ISC",
   "dependencies": {
-    "lodash-es": "^4.17.21"
+    "@rspack/binding": "0.0.3",
+    "commander": "^9.4.0",
+    "@rspack/dev-server": "^0.0.2",
+    "@rspack/plugin-postcss": "^0.0.2"
+  },
+  "optionalDependencies": {
+    "@tmp-sass-embedded/darwin-arm64": "1.54.4",
+    "@tmp-sass-embedded/darwin-x64": "1.54.4",
+    "@tmp-sass-embedded/linux-arm64": "1.54.4",
+    "@tmp-sass-embedded/linux-ia32": "1.54.4",
+    "@tmp-sass-embedded/linux-x64": "1.54.4",
+    "@tmp-sass-embedded/win32-ia32": "1.54.4",
+    "@tmp-sass-embedded/win32-x64": "1.54.4"
+  },
+  "scripts": {
+    "build": "rm -rf dist/ && tsc -p tsconfig.json",
+    "dev": "tsc -p tsconfig.json -w",
+    "example": "node -r tsm ./example/basic.ts"
   }
-}
+}

package/src/bin/index.ts

@@ -0,0 +1,36 @@
+import { Command } from "commander";
+import { createServer } from "rspack-dev-server";
+import { Rspack } from "..";
+import fs from "fs";
+import { build } from "../build";
+
+const program = new Command();
+
+program
+	.option("--env", "env")
+	.command("build", {
+		isDefault: true
+	})
+	.description("Rspack build cli")
+
+	.argument("<config-file>", "rspack config  file path")
+	.action(async configPath => {
+		const config = require(configPath);
+		const stats = await build(config);
+		console.log(stats);
+	});
+
+program
+	.command("dev")
+	.description("Rspack build cli")
+	.argument("<config-file>", "rspack config file path")
+	.action(async configPath => {
+		const config = require(configPath);
+		const rspack = new Rspack(config);
+		const { options: { dev: { port = 8080 } = {} } = {} } = rspack;
+		await rspack.build();
+		const server = await createServer(rspack.options);
+		server.listen(port, () => console.log(`Server listening on port: ${port}`));
+	});
+
+program.parse();

package/src/build.ts

@@ -0,0 +1,8 @@
+import { Rspack } from ".";
+export async function build(config: any) {
+	const rspack = new Rspack(config);
+	const stats = await rspack.build();
+	if (stats.errors.length > 0) {
+		throw new Error(stats.errors[0].message);
+	}
+}

package/src/config.ts

@@ -0,0 +1,66 @@
+import type { RawOptions } from "@rspack/binding";
+
+import type { ModuleRule } from ".";
+import { createRawModuleRuleUses } from ".";
+
+export type Plugin = {
+	name: string;
+	done?: () => void | Promise<void>;
+};
+
+export interface RspackOptions {
+	/**
+	 * Entry points of compilation.
+	 */
+	entry?: RawOptions["entry"];
+	/**
+	 * An **absolute** path pointed the
+	 */
+	context?: RawOptions["context"];
+	/**
+	 * An array of plugins
+	 */
+	plugins?: Plugin[];
+	/**
+	 * dev server
+	 */
+	dev?: {
+		port?: Number;
+		static?: {
+			directory?: string;
+		};
+	};
+	/**
+	 * Module configuration.
+	 */
+	module?: {
+		rules?: ModuleRule[];
+		parser?: RawOptions["module"]["parser"];
+	};
+	define?: RawOptions["define"];
+	target?: RawOptions["target"];
+	mode?: RawOptions["mode"];
+	external?: RawOptions["external"];
+}
+
+export function User2Native(config: RspackOptions): RawOptions & {
+	plugins: Plugin[];
+} {
+	return {
+		entry: config.entry ?? {},
+		context: config.context,
+		define: config.define,
+		target: config.target,
+		external: config.external,
+		plugins: config.plugins ?? [],
+		module: {
+			// TODO: support mutliple rules to support `Module Type`
+			rules: (config?.module?.rules ?? []).map(rule => {
+				return {
+					...rule,
+					uses: createRawModuleRuleUses(rule.uses || [])
+				};
+			})
+		}
+	};
+}

package/src/index.ts

@@ -0,0 +1,252 @@
+export * from "./build";
+
+import * as binding from "@rspack/binding";
+import type {
+	ExternalObject,
+	RspackInternal,
+	RawModuleRuleUse,
+	RawModuleRule
+} from "@rspack/binding";
+
+import assert from "node:assert";
+import * as Config from "./config";
+import type { RspackOptions } from "./config";
+
+interface ModuleRule {
+	test?: RawModuleRule["test"];
+	resource?: RawModuleRule["resource"];
+	resourceQuery?: RawModuleRule["resourceQuery"];
+	uses?: ModuleRuleUse[];
+	type?: RawModuleRule["type"];
+}
+
+type ModuleRuleUse =
+	| {
+			builtinLoader: BuiltinLoader;
+			options?: unknown;
+	  }
+	| {
+			loader: JsLoader;
+			options?: unknown;
+	  };
+
+interface JsLoader {
+	(this: LoaderContext, loaderContext: LoaderContext):
+		| Promise<LoaderResult | void>
+		| LoaderResult
+		| void;
+	displayName?: string;
+}
+
+type BuiltinLoader = string;
+
+interface LoaderThreadsafeContext {
+	id: number;
+	p: LoaderContextInternal;
+}
+
+interface LoaderContextInternal {
+	// TODO: It's not a good way to do this, we should split the `source` into a separate type and avoid using `serde_json`, but it's a temporary solution.
+	source: number[];
+	resource: String;
+	resourcePath: String;
+	resourceQuery: String | null;
+	resourceFragment: String | null;
+}
+
+interface LoaderContext
+	extends Pick<
+		LoaderContextInternal,
+		"resource" | "resourcePath" | "resourceQuery" | "resourceFragment"
+	> {
+	source: {
+		getCode(): string;
+		getBuffer(): Buffer;
+	};
+}
+
+interface LoaderResultInternal {
+	content: number[];
+	meta: number[];
+}
+
+interface LoaderResult {
+	content: Buffer | string;
+	meta: Buffer | string;
+}
+
+interface LoaderThreadsafeResult {
+	id: number;
+	p: LoaderResultInternal | null | undefined;
+}
+
+const toBuffer = (bufLike: string | Buffer): Buffer => {
+	if (Buffer.isBuffer(bufLike)) {
+		return bufLike;
+	} else if (typeof bufLike === "string") {
+		return Buffer.from(bufLike);
+	}
+
+	throw new Error("Buffer or string expected");
+};
+
+function createRawModuleRuleUses(uses: ModuleRuleUse[]): RawModuleRuleUse[] {
+	return createRawModuleRuleUsesImpl([...uses].reverse());
+}
+
+function createRawModuleRuleUsesImpl(
+	uses: ModuleRuleUse[]
+): RawModuleRuleUse[] {
+	const index = uses.findIndex(use => "builtinLoader" in use);
+	if (index < 0) {
+		return [composeJsUse(uses)];
+	}
+
+	const before = uses.slice(0, index);
+	const after = uses.slice(index + 1);
+	return [
+		composeJsUse(before),
+		createNativeUse(uses[index]),
+		...createRawModuleRuleUsesImpl(after)
+	];
+}
+
+function createNativeUse(use: ModuleRuleUse): RawModuleRuleUse {
+	assert("builtinLoader" in use);
+
+	if (use.builtinLoader === "sass-loader") {
+		(use.options ??= {} as any).__exePath = require.resolve(
+			`@tmp-sass-embedded/${process.platform}-${
+				process.arch
+			}/dart-sass-embedded/dart-sass-embedded${
+				process.platform === "win32" ? ".bat" : ""
+			}`
+		);
+	}
+
+	return {
+		builtinLoader: use.builtinLoader,
+		options: JSON.stringify(use.options)
+	};
+}
+
+function composeJsUse(uses: ModuleRuleUse[]): RawModuleRuleUse {
+	async function loader(err: any, data: Buffer): Promise<Buffer> {
+		if (err) {
+			throw err;
+		}
+
+		const loaderThreadsafeContext: LoaderThreadsafeContext = JSON.parse(
+			data.toString("utf-8")
+		);
+
+		const { p: payload, id } = loaderThreadsafeContext;
+
+		const loaderContextInternal: LoaderContextInternal = {
+			source: payload.source,
+			resourcePath: payload.resourcePath,
+			resourceQuery: payload.resourceQuery,
+			resource: payload.resource,
+			resourceFragment: payload.resourceFragment
+		};
+
+		let sourceBuffer = Buffer.from(loaderContextInternal.source);
+		let meta = Buffer.from("");
+		// Loader is executed from right to left
+		for (const use of uses) {
+			assert("loader" in use);
+			const loaderContext = {
+				...loaderContextInternal,
+				source: {
+					getCode(): string {
+						return sourceBuffer.toString("utf-8");
+					},
+					getBuffer(): Buffer {
+						return sourceBuffer;
+					}
+				},
+				getOptions() {
+					return use.options;
+				}
+			};
+
+			let loaderResult: LoaderResult;
+			if (
+				(loaderResult = await Promise.resolve().then(() =>
+					use.loader.apply(loaderContext, [loaderContext])
+				))
+			) {
+				const content = loaderResult.content;
+				meta = meta.length > 0 ? meta : toBuffer(loaderResult.meta);
+				sourceBuffer = toBuffer(content);
+			}
+		}
+
+		const loaderResultPayload: LoaderResultInternal = {
+			content: [...sourceBuffer],
+			meta: [...meta]
+		};
+
+		const loaderThreadsafeResult: LoaderThreadsafeResult = {
+			id: id,
+			p: loaderResultPayload
+		};
+		return Buffer.from(JSON.stringify(loaderThreadsafeResult), "utf-8");
+	}
+	loader.displayName = `NodeLoaderAdapter(${uses
+		.map(item => {
+			assert("loader" in item);
+			return item.loader.displayName || item.loader.name || "unknown-loader";
+		})
+		.join(" -> ")})`;
+	return {
+		loader
+	};
+}
+interface RspackThreadsafeContext<T> {
+	readonly id: number;
+	readonly inner: T;
+}
+interface RspackThreadsafeResult<T> {
+	readonly id: number;
+	readonly inner: T;
+}
+const createDummyResult = (id: number): string => {
+	const result: RspackThreadsafeResult<null> = {
+		id,
+		inner: null
+	};
+	return JSON.stringify(result);
+};
+class Rspack {
+	#instance: ExternalObject<RspackInternal>;
+	#plugins: RspackOptions["plugins"];
+	constructor(public options: RspackOptions) {
+		const nativeConfig = Config.User2Native(options);
+		this.#plugins = options.plugins ?? [];
+
+		this.#instance = binding.newRspack(nativeConfig, {
+			doneCallback: this.#done.bind(this)
+		});
+	}
+	async #done(err: Error, value: string) {
+		const context: RspackThreadsafeContext<void> = JSON.parse(value);
+		for (const plugin of this.#plugins) {
+			await plugin.done?.();
+		}
+		return createDummyResult(context.id);
+	}
+	async build() {
+		const stats = await binding.build(this.#instance);
+		return stats;
+	}
+
+	async rebuild() {
+		const stats = await binding.rebuild(this.#instance);
+		return stats;
+	}
+}
+
+export { Rspack, createRawModuleRuleUses };
+export type { ModuleRule };
+export default Rspack;

package/tsconfig.json

@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "module": "CommonJS",
+    "target": "ES2018",
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "outDir": "dist",
+    "declaration": true
+  },
+  "include": [
+    "src"
+  ]
+}

package/index.js

@@ -1 +0,0 @@
-module.exports = {}