Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error when using .css source files #507

Closed
SammyM opened this issue Mar 16, 2015 · 7 comments
Closed

Error when using .css source files #507

SammyM opened this issue Mar 16, 2015 · 7 comments

Comments

@SammyM
Copy link

SammyM commented Mar 16, 2015

I'm trying to generate a style guide only using .css files, but I'm getting the following error:

TypeError: Cannot read property 'test' of undefined

which results in the styleguide not building correctly.

I've tried with a number of different setups, these being:

  • Using the sc5-styleguide demo and changing the demo-gulpfile.js source from source = 'lib/app/**/*.scss' to source = 'lib/app/**/*.css' - I placed a CSS stylesheet in this directory.
  • Running styleguide from the command line with the following options: styleguide --kss-source "style.css" --style-source "style.css" --output styleguide.
  • Implemented tasks within my own gulpfile.

On each occasion, if I rename my css file to '.scss' the error goes away.

Is there a way I can use vanilla CSS files to generate the style guide, and if so, is there anything obvious that I've missed?

@cyberixae cyberixae self-assigned this Mar 19, 2015
@cyberixae
Copy link
Contributor

I started looking at the status of CSS support yesterday. I think plain CSS has not been popular among style guide users and has therefore not received much attention.

@cyberixae
Copy link
Contributor

KSS has been defined for plain CSS so that should not be a problem. See http://warpspire.com/kss/syntax/ for an example of that. However this does not guarantee that the syntax would work with SC5-Styleguide.

@cyberixae
Copy link
Contributor

We do not currently have tests for plain CSS. I tried adding some plain CSS tests by simply copying the LESS tests and turning them into similar CSS notation. However, the current tests have been written for preprocessors that support variables. Therefore the test javascript would require some tweaking to make it skip the part of tests related to variables when testing basic CSS.

@cyberixae
Copy link
Contributor

I decided to test the behaviour from the command line and created a file with name button.css with the following contents:

/*
Button

Buttons are red

markup:
<button class="test-button">text</button>

Styleguide 1.1
*/

.test-button {
    background-color: #f00;
}

Now when running command styleguide --kss-source "button.css" --style-source "button.css" --output output --watch --server I also get the error TypeError: Cannot read property 'test' of undefined

@cyberixae
Copy link
Contributor

I got the example from above working by adding visitors.css = visitors.sass; to two places in lib/modules/variable-parser.js I will create a pull request with the fix but I will attempt to create tests first to make sure this does not break again in the future.

@cyberixae cyberixae removed their assignment Mar 20, 2015
hannu added a commit that referenced this issue Mar 20, 2015
Fix basic plain CSS support, fixes #507
@cyberixae cyberixae added the bug label Mar 20, 2015
@cyberixae cyberixae added this to the 0.3.8 milestone Mar 20, 2015
@cyberixae cyberixae modified the milestones: 0.3.8, Focus Mar 25, 2015
@SammyM
Copy link
Author

SammyM commented Mar 26, 2015

Thank you for looking into this! Do you have an ETA of when it'll be released?

@cyberixae
Copy link
Contributor

We have planned a release cycle of perhaps every other week but we have not yet agreed on how exactly it will work, so unfortunately I can not give you a date right now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants