Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

.cjs extension in main package.json field causes imported CSS file output to be overwritten #883

Closed
lokimckay opened this issue Aug 23, 2021 · 8 comments · Fixed by #919
Closed

Comments

@lokimckay
Copy link

lokimckay commented Aug 23, 2021

Using a .cjs extension in the main field of package.json (e.g. "main": "./dist/foo.cjs") as per README causes microbundle to swallow any .css or .scss files imported

Reproduction steps

Repo: https://github.com/lokimckay-references/microbundle-883

  1. npm init -y
  2. npm install microbundle --save-dev
  3. add styles.css and index.js files
  4. import "./styles.css" within index.js
  5. copy source/exports/main/module/unpkg fields into package.json as per README
    {
      "name": "foo",                     // your package name
      "type": "module",
      "source": "src/foo.js",            // your source code
      "exports": "./dist/foo.modern.js", // where to generate the modern bundle (see below)
      "main": "./dist/foo.cjs",          // where to generate the CommonJS bundle
      "module": "./dist/foo.module.js",  // where to generate the ESM bundle
      "unpkg": "./dist/foo.umd.js",      // where to generate the UMD bundle (also aliased as "umd:main")
      "scripts": {
        "build": "microbundle",          // compiles "source" to "main"/"module"/"unpkg"
        "dev": "microbundle watch"       // re-build when source files change
      }
    }
    
  6. update source field to point to index.js
  7. npm run build

Actual output

  • All compiled formats of index.js
  • Below error message
The emitted file "foo.cjs" overwrites a previously emitted file of the same name.

image

Expected output

  • All compiled formats of index.js
  • styles.css
  • No error message

Workaround

Change the file extension of the main field from ./dist/foo.cjs -> ./dist/foo.js
= achieves expected output

@lokimckay lokimckay changed the title .cjs extension causes CSS overwrite .cjs extension in main package.json field causes CSS file output to be overwritten Aug 24, 2021
@lokimckay lokimckay changed the title .cjs extension in main package.json field causes CSS file output to be overwritten .cjs extension in main package.json field causes imported CSS file output to be overwritten Aug 24, 2021
@bluelovers
Copy link

image

@rschristian
Copy link
Collaborator

Sorry about that, was missing .cjs from the regex. Should be fixed when #919 is merged and released.

@leohxj
Copy link

leohxj commented Apr 23, 2022

microbundle: 0.14.2 see the same error, does it published ??

@rschristian
Copy link
Collaborator

No, that has not yet been published.

@leohxj
Copy link

leohxj commented Apr 23, 2022

thanks @rschristian , when will publish it? is there a estimate time?

@rschristian
Copy link
Collaborator

There's no ETA, no. You can use something like patch-package to copy over the diff from #919 in the meantime.

@rschristian
Copy link
Collaborator

@leohxj Just wanted to update you that v0.15 was just published containing this fix.

@leohxj
Copy link

leohxj commented Apr 27, 2022

@rschristian thanks bro

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants