
Security News
Open Source Maintainers Feeling the Weight of the EU’s Cyber Resilience Act
The EU Cyber Resilience Act is prompting compliance requests that open source maintainers may not be obligated or equipped to handle.
posthtml-postcss
Advanced tools
npm i -D posthtml-postcss
import {dirname} from 'node:path'
import {readFileSync} from 'node:fs'
import {fileURLToPath} from 'node:url'
import posthtml from 'posthtml'
import postcss from 'posthtml-postcss'
const postcssPlugins = []
const postcssOptions = {}
const filterType = /^text\/css$/
const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)
const filePath = `${__dirname}/index.html`
const html = readFileSync(filePath, 'utf8')
posthtml([
postcss(postcssPlugins, postcssOptions, filterType)
])
.process(html, {from: filePath})
.then((result) => console.log(result.html))
If you don't pass any arguments to posthtml-postcss
, it will try to use your project's PostCSS configuration (see postcss-load-config
).
Notice that we're setting the option from
when calling process
. posthtml-postcss
forwards this to PostCSS, which is useful for syntax error messages. (postcss-cli
and gulp-posthtml
are setting from
automatically.)
import posthtml from 'posthtml'
import postcss from 'posthtml-postcss'
import autoprefixer from 'autoprefixer'
const postcssPlugins = [
autoprefixer({ browsers: ['last 2 versions'] })
]
const postcssOptions = {}
const filterType = /^text\/css$/
const html = `
<style>div { display: flex; }</style>
<div style="display: flex;">Text</div>
`
posthtml([
postcss(postcssPlugins, postcssOptions, filterType)
])
.process(html)
.then(result => console.log(result.html))
Output:
<style>
div { display: -webkit-flex;display: -ms-flexbox;display: flex; }
</style>
<div style="display: -webkit-flex;display: -ms-flexbox;display: flex;">
Text
</div>
<small>1.0.4 (2025-03-04)</small>
FAQs
Use PostCSS with PostHTML
The npm package posthtml-postcss receives a total of 6,964 weekly downloads. As such, posthtml-postcss popularity was classified as popular.
We found that posthtml-postcss demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The EU Cyber Resilience Act is prompting compliance requests that open source maintainers may not be obligated or equipped to handle.
Security News
Crates.io adds Trusted Publishing support, enabling secure GitHub Actions-based crate releases without long-lived API tokens.
Research
/Security News
Undocumented protestware found in 28 npm packages disrupts UI for Russian-language users visiting Russian and Belarusian domains.