(#3) Example Sass Script for Example Site #8
Conversation
karlikpj
force-pushed
the
ticket/3-simple-dar-sass-example
branch
8 times, most recently
from
5cd7b2b to
a5dd13b
Compare
karlikpj
force-pushed
the
ticket/3-simple-dar-sass-example
branch
from
a5dd13b to
8a32b38
Compare
ncids-webpack/src/scss/README.md
Outdated
| @import "nci-header"; | ||
| @import "usa-button"; | ||
| @import "usa-sidenav"; |
There was a problem hiding this comment.
What is @import? Do you mean @forward?
ncids-webpack/src/scss/README.md
Outdated
| @@ -0,0 +1,41 @@ | |||
| # NCIDS Sass example compile methods | |||
|
|
|||
| ### Compile NCIDS into directly CSS | |||
There was a problem hiding this comment.
Can you write this like https://github.com/NCIOCPL/ncids-example-sites/tree/main/ncids-webpack on the steps for doing this? Treat it as if someone copy/pasted the files here into their own repo.
ncids-webpack/src/scss/index.scss
Outdated
| @import "usa-button"; | ||
| @import "nci-header"; | ||
| @import "usa-sidenav"; | ||
| @import 'usa-site-alert'; |
There was a problem hiding this comment.
I think you mean @forward
karlikpj
force-pushed
the
ticket/3-simple-dar-sass-example
branch
4 times, most recently
from
367465c to
c049171
Compare
bryanpizzillo
left a comment
bryanpizzillo
left a comment
There was a problem hiding this comment.
@karlikpj all of this stuff needs to be in another folder. ncids-webpack should NOT change at all. Everything should be in something like dart-sass.
karlikpj
force-pushed
the
ticket/3-simple-dar-sass-example
branch
2 times, most recently
from
ab15dd7 to
c503082
Compare
There was a problem hiding this comment.
there shoudn't be any changes to ncids-webpack
karlikpj
force-pushed
the
ticket/3-simple-dar-sass-example
branch
2 times, most recently
from
b561ec0 to
940f79a
Compare
karlikpj
force-pushed
the
ticket/3-simple-dar-sass-example
branch
from
940f79a to
a346328
Compare
olitharp-nci
force-pushed
the
ticket/3-simple-dar-sass-example
branch
from
84f4b99 to
954a2d1
Compare
bryanpizzillo
left a comment
bryanpizzillo
left a comment
There was a problem hiding this comment.
So overall, I made a node below from the package.json. I wonder if we should require sass and postcss installed globably so we can just run our tool.
| "author": "National Cancer Institute", | ||
| "license": "ISC", | ||
| "scripts": { | ||
| "build:css": "sass -I ./node_modules/@nciocpl/ncids-css/uswds-packages -I ./node_modules/@nciocpl/ncids-css/packages ./src/index.scss ./dist/ncids-compiled.css && postcss ./dist/ncids-compiled.css --output ./dist/styles.css", |
There was a problem hiding this comment.
This can be:
sass -I ./node_modules/@nciocpl/ncids-css/uswds-packages -I ./node_modules/@nciocpl/ncids-css/packages ./src/index.scss | postcss --output ./dist/styles.css
Sass will output to standard out when not given an output file name. Postcss will read from standard in when you have not specified a filename.
The same can apply below. This would also need some info on the readme.
Closes #3