I'll preface this by stating that I'm new to PostCSS, so this may be user error. After installing and running bassplate as instructed, the imports for standard modules such as @import 'basscss-typography'; simply output themselves instead of the CSS in the corresponding file.

I've found that if I use @import 'basscss/node_modules/basscss-typography'; it will work as expected.

And if it makes any difference, I'm using Node 4.4.5 on Windows.

Hello - thank you for basscss.

I am trying to use it for my site, starting with the "bassplate" template. I like how bassplate uses npm scripts for the build tool.

It's using cssnext to autoprefix, but looking into node_modules after installing, this module appears to be deprecated. I think it is working still, but, how could it be upgraded to a more future-proof method?

Also, I'm wondering if you can perhaps point me in the right direction to process js files in a similar way in an npm script?

Thank you,
Rick

I was testing v8 with bassplate, and it fails to build. I didn't update the existing project, but did the clean install. I guess it has to do with incorrect paths after the update to v8. Here's the excerpt:

postcss-import: /Users/petar/Dropbox/Projects/basscss8/src/base.css:20:1: Failed to find 'basscss-padding' in [ /Users/petar/Dropbox/Projects/basscss8/src ]

postcss-import: /Users/petar/Dropbox/Projects/basscss8/src/base.css:21:1: Failed to find 'basscss-grid' in [ /Users/petar/Dropbox/Projects/basscss8/src ]

postcss-import: /Users/petar/Dropbox/Projects/basscss8/src/base.css:22:1: Failed to find 'basscss-flexbox' in [ /Users/petar/Dropbox/Projects/basscss8/src ]

The watch:css script does not work on Windows 10 and probably all Win versions. Being quite new to node and npm it took me a while to figure out that the single quotes where the problem here. Some info here: keithamus/npm-scripts-example#5

Using escaped double quotes solves the problem and should work on all OS's.

"watch:css": "watch \"npm run css && npm run minify:css\" ./src"

Also the parallel running with & in the start script does not work on Windows. Only the watch:css runs. If you change the order only serve is being run. I don't need the http-server so not a problem for me but you could mention this somewhere. Maybe Windows users should look at https://www.npmjs.com/package/npm-run-all or maybe there is another solution i'm not aware of.

When you uncomment all optional basscss modules in bassplate's src/base.css in order to include them in the build, $ npm start fails. It's been happening for at least a month.

I'm not sure what the actual problem is, but i've narrowed down the list of modules that throw the error:

/*@import 'basscss-color-buttons';*/
/*@import 'basscss-button-blue';*/
/*@import 'basscss-button-blue-outline';*/
/*@import 'basscss-button-gray';*/
/*@import 'basscss-button-light-gray';*/
/*@import 'basscss-button-red';*/

Here is the npm error message:

npm ERR! Darwin 14.4.0
npm ERR! argv "node" "/usr/local/bin/npm" "run" "minify:css"
npm ERR! node v0.12.4
npm ERR! npm  v2.10.1
npm ERR! code ELIFECYCLE
npm ERR! [email protected] minify:css: `cssnext -c src/base.css css/base.min.css`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] minify:css script 'cssnext -c src/base.css css/base.min.css'.
npm ERR! This is most likely a problem with the bassplate package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     cssnext -c src/base.css css/base.min.css
npm ERR! You can get their info via:
npm ERR!     npm owner ls bassplate
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/brianzelip/WebProjects/leaflet-map-sandbox/testing_customization/npm-debug.log

And here is the content of npm-debug.log:

0 info it worked if it ends with ok
1 verbose cli [ 'node', '/usr/local/bin/npm', 'run', 'minify:css' ]
2 info using [email protected]
3 info using [email protected]
4 verbose node symlink /usr/local/bin/node
5 verbose run-script [ 'preminify:css', 'minify:css', 'postminify:css' ]
6 info preminify:css [email protected]
7 info minify:css [email protected]
8 verbose unsafe-perm in lifecycle true
9 info [email protected] Failed to exec minify:css script
10 verbose stack Error: [email protected] minify:css: `cssnext -c src/base.css css/base.min.css`
10 verbose stack Exit status 2
10 verbose stack     at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:213:16)
10 verbose stack     at EventEmitter.emit (events.js:110:17)
10 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:24:14)
10 verbose stack     at ChildProcess.emit (events.js:110:17)
10 verbose stack     at maybeClose (child_process.js:1015:16)
10 verbose stack     at Process.ChildProcess._handle.onexit (child_process.js:1087:5)
11 verbose pkgid [email protected]
12 verbose cwd /Users/brianzelip/WebProjects/leaflet-map-sandbox
13 error Darwin 14.4.0
14 error argv "node" "/usr/local/bin/npm" "run" "minify:css"
15 error node v0.12.4
16 error npm  v2.10.1
17 error code ELIFECYCLE
18 error [email protected] minify:css: `cssnext -c src/base.css css/base.min.css`
18 error Exit status 2
19 error Failed at the [email protected] minify:css script 'cssnext -c src/base.css css/base.min.css'.
19 error This is most likely a problem with the bassplate package,
19 error not with npm itself.
19 error Tell the author that this fails on your system:
19 error     cssnext -c src/base.css css/base.min.css
19 error You can get their info via:
19 error     npm owner ls bassplate
19 error There is likely additional logging output above.
20 verbose exit [ 1, true ]

If you list basscss as an npm dep, then most of the modules listed in the Basscss Modules section load fine, but

@import 'basscss-utility-typography';
@import 'basscss-utility-layout';

... fail the postcss compilation as they have to be explicitly added as additional deps.

Should baseplate list them in the commented out optional section, or should basscss add them as a core dependency?

Hello guys, thanks for creating cool toolkit such as BASSCSS 😃. I need to ask something how can I override custom properties in this package https://github.com/basscss/bassplate? I can't find where the documentation of available variables. Thank you!

I realize this is likely a PostCSS question...this demo shows a package.json that depends on each Basscss individual package. I'd like to switch to just doing:

npm install basscss

But then each Basscss component is under node_modules/basscss/node_modules/*. I can't figure out the correct @import to use for a case like this.

I think it is worth documenting somewhere as people are more likely to use the single npm package. I don't know if this demo is the correct place or the Basscss docs themselves.