parcel: [parcel 2] does not minify css imported with `bundle-text:`

🐛 bug report

When importing css as string into javascript with bundle-text: as described here the css does not get processed at all.

🎛 Configuration (.babelrc, package.json, cli command)

Cli command: npm run build

Please see attached .zip file for the rest.

🤔 Expected Behavior

The inlined css code should be minified and look like this:

!function(){var n,e=(n="body{background:red}")&&n.__esModule?n.default:n;const d=document.createElement("style"),t=()=>document.body.append(d);d.type="text/css",d.append(e),document.body?t():window.addEventListener("DOMContentLoaded",t)}();

😯 Current Behavior

The inlined css code looks just like before.

!function(){var n,e=(n="/* THIS IS A COMMENT*/\n\n\n/*\nh\ne\nr\ne\n\nh\ne\nr\ne\n\n\nb\ne\n\nw\nh\ni\nt\ne\ns\np\na\nc\ne\ns\n*/\n\n\n\n\n\n\n\n\nbody                                                                                                  {\n                        background: red;\n}\n\n")&&n.__esModule?n.default:n;const d=document.createElement("style"),t=()=>document.body.append(d);d.type="text/css",d.append(e),document.body?t():window.addEventListener("DOMContentLoaded",t)}();

💁 Possible Solution

Process the css

🔦 Context

https://github.com/parcel-bundler/parcel/discussions/5751

💻 Code Sample

parcel-no-css-postpro.zip

🌍 Your Environment

Software	Version(s)
Parcel	2.0.0-nightly.562+fbca3a93
Node	v15.6.0
npm/Yarn	7.4.0
Operating System	macOS High Sierra 10.13.6

About this issue

Original URL
State: closed
Created 3 years ago
Comments: 16 (14 by maintainers)

Most upvoted comments

This should be fixed in #6379. Basically it will only try to match pipelines that actually exist in the optimizers config. See https://github.com/parcel-bundler/parcel/pull/6379/commits/a2a7da176c482353ea192bbe50cd75c38e2e2407. Does this logic make sense to you?

devongovett on May 31, 2021

Yeah. You still shouldn’t have to actually list out all pipelines in the optimizers object though…

mischnic on Feb 9, 2021

-> https://github.com/parcel-bundler/parcel/issues/5765

mischnic on Feb 3, 2021

We should probably add a pure comment to the interop call, Terser removes everything here:

!(function () {
  const css = "body{background:red}";
  function $parcel$interopDefault(a) {
    return a && a.__esModule ? a.default : a;
  }
  const $css$interop = /*@__PURE__ */$parcel$interopDefault(css);
  // console.log($css$interop);
})();

Would that fix your case?

mischnic on Feb 3, 2021