Comments are not getting stripped for me with this postcss.config.js:
const cssDependencies = [
{ type: 'dir', dir: 'app/assets/stylesheets/utility' },
{ type: 'dir', dir: 'app/assets/stylesheets/app' },
]
module.exports = {
processors: {
'postcss-strip-inline-comments': {},
},
syntax: 'postcss-scss',
plugins: {
'postcss-import-ext-glob': {},
'postcss-import': ({}),
'postcss-add-dependencies': ({ dependencies: cssDependencies }),
'postcss-nested': {},
'postcss-include-media': {},
'autoprefixer': {},
},
}
// Test file
.example {
h1 {
color: red;
}
}
is output as
// Test file
.example h1 {
color: red;
}
and the style is not applied in the browser as the parser gives up at the invalid //.
If I change syntax: 'postcss-scss' to parser: 'postcss-scss' the style is applied in the browser, but the output is now
/* Test file*/
.example h1 {
color: red;
}
and the effect is exactly the same as not installing postcss-strip-inline-comments.
My package.json:
{
"name": "app",
"private": "true",
"dependencies": {
"@hotwired/stimulus": "^3.0.1",
"@hotwired/turbo-rails": "^7.1.3",
"autoprefixer": "^10.4.7",
"esbuild": "^0.14.45",
"postcss": "^8.4.14",
"postcss-add-dependencies": "^1.1.1",
"postcss-cli": "^9.1.0",
"postcss-import": "^14.1.0",
"postcss-import-ext-glob": "^2.0.1",
"postcss-nested": "^5.0.6",
"postcss-scss": "^4.0.4",
"postcss-strip-inline-comments": "^0.1.5"
},
"devDependencies": {
"postcss-include-media": "^1.1.0"
},
"scripts": {
"build": "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds",
"build:css": "postcss ./app/assets/stylesheets/application.postcss.css -o ./app/assets/builds/application.css"
}
}
and the processing is run with yarn build:css --watch. The yarn.lock shows postcss-scss version 4.0.4 and postcss-strip-inline-comments version 0.1.5.
I'm really not sure whether I've run into a bug or just misconfigured something. I thought it might be related to the comment being in a sheet imported using @import via postcss-import, but the same problem occurs in the entrypoint application.postcss.css.
Comments are not getting stripped for me with this postcss.config.js:
is output as
and the style is not applied in the browser as the parser gives up at the invalid
//.If I change
syntax: 'postcss-scss'toparser: 'postcss-scss'the style is applied in the browser, but the output is nowand the effect is exactly the same as not installing postcss-strip-inline-comments.
My package.json:
{ "name": "app", "private": "true", "dependencies": { "@hotwired/stimulus": "^3.0.1", "@hotwired/turbo-rails": "^7.1.3", "autoprefixer": "^10.4.7", "esbuild": "^0.14.45", "postcss": "^8.4.14", "postcss-add-dependencies": "^1.1.1", "postcss-cli": "^9.1.0", "postcss-import": "^14.1.0", "postcss-import-ext-glob": "^2.0.1", "postcss-nested": "^5.0.6", "postcss-scss": "^4.0.4", "postcss-strip-inline-comments": "^0.1.5" }, "devDependencies": { "postcss-include-media": "^1.1.0" }, "scripts": { "build": "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds", "build:css": "postcss ./app/assets/stylesheets/application.postcss.css -o ./app/assets/builds/application.css" } }and the processing is run with
yarn build:css --watch. The yarn.lock shows postcss-scss version 4.0.4 and postcss-strip-inline-comments version 0.1.5.I'm really not sure whether I've run into a bug or just misconfigured something. I thought it might be related to the comment being in a sheet imported using
@importvia postcss-import, but the same problem occurs in the entrypoint application.postcss.css.