web-infra-dev / web-infra-dev/rslib

[Bug]: Wrong bundling of `asset/source` in `cjs` format

Open
#1,104 6 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Rspack
Dominant language
TypeScript
Stars
1k
Forks
67
Avg merge
6h 9m
Merged PRs (30d)
57

Description

Version
@rslib/core@0.10.4
Details

Config almost default

import { defineConfig } from '@rslib/core';

export default defineConfig({
  lib: [
    {
      format: 'esm',
      syntax: ['node 18'],
      dts: true,
      bundle: false,
    },
    {
      format: 'cjs',
      syntax: ['node 18'],
      bundle: false,
    },
  ],
  tools: {
    rspack(config, { addRules }) {
      addRules([
        {
          test: /\.html$/i,
          type: 'asset/source',
        },
      ]);
    },
  },
});

Result code of test.html with comments

"use strict";
var __webpack_modules__ = {
    "./src/html/test.html": function(module) {
        // Exports without `default`
        module.exports = "<html>\n  <body>\n    <h1>Hello World</h1>\n  </body>\n</html>\n";
    }
};
var __webpack_module_cache__ = {};
function __webpack_require__(moduleId) {
    var cachedModule = __webpack_module_cache__[moduleId];
    if (void 0 !== cachedModule) return cachedModule.exports;
    var module = __webpack_module_cache__[moduleId] = {
        exports: {}
    };
    __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
    return module.exports;
}
var __webpack_exports__ = __webpack_require__("./src/html/test.html");
exports["default"] = __webpack_exports__["default"]; // undefined
// iterating over string results in `{ 0: '<', 1: 'h', 2: 't', ... }`
for(var __webpack_i__ in __webpack_exports__)if (-1 === [
    "default"
].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
Object.defineProperty(exports, '__esModule', {
    value: true
});

As result it exports something like

{ 0: '<', 1: 'h', 2: 't', ..., default: undefined }

I'm unsure is it rslib issue or rspack or maybe wrong configuration 🤔

Expected result (updated)
import testHtml from './html/test.html';

console.log(testHtml); // `<html ...`

Like https://webpack.js.org/guides/asset-modules/#source-assets

Reproduce link

https://github.com/Shamilik/rslib-html

Reproduce Steps
  1. npm run build
  2. node dist/index.cjs

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked rslib-html reproduction, run npm run build, and inspect the generated CJS output with node dist/index.cjs. Compare the asset/source result with the expected default import string; done means the HTML is exported as the imported value rather than indexed string properties.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, typescript
Domain
build-system
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.