postcss / postcss-nested

PostCSS plugin to unwrap nested rules like how Sass does it.
MIT License
1.15k stars 66 forks source link

Keep getting throw errors every time I go to nest. #72

Closed georgemeehan closed 6 years ago

georgemeehan commented 6 years ago

Hi, I keep getting a throw error every time I go use the nesting in postcss. Here are the code and the error message I keep getting.

.large-hero {
  position: relative;
  &__text-content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 100%;
    text-align: center;
  }
  &__title {
    margin: 0;
    font-weight: 300;
    color: #2f5572;
    font-size: 4.8rem;
  }
  &__subtitle {
    margin: 0;
    font-weight: 300;
    color: #2f5572;
    font-size: 2.9rem;
  }
  &__description {
    color: #fff;
    font-size: 1.5rem;
  }
}
events.js:183
      throw er; // Unhandled 'error' event
      ^
CssSyntaxError: postcss-import: C:\Projects\travel-site\app\assets\styles\modules\_large-hero.css:1:1: Unclosed bl
ock
    at Input.error (C:\Projects\travel-site\node_modules\postcss\lib\input.js:113:22)
    at Parser.unclosedBlock (C:\Projects\travel-site\node_modules\postcss\lib\parser.js:515:26)

    at Parser.endFile (C:\Projects\travel-site\node_modules\postcss\lib\parser.js:358:39)
    at Parser.parse (C:\Projects\travel-site\node_modules\postcss\lib\parser.js:88:14)
    at parse (C:\Projects\travel-site\node_modules\postcss\lib\parse.js:24:16)
    at new LazyResult (C:\Projects\travel-site\node_modules\postcss\lib\lazy-result.js:70:24)
    at Processor.process (C:\Projects\travel-site\node_modules\postcss\lib\processor.js:117:12)
    at runPostcss (C:\Projects\travel-site\node_modules\postcss-import\lib\process-content.js:46:6)
    at processContent (C:\Projects\travel-site\node_modules\postcss-import\lib\process-content.js:40:10)
    at Promise.resolve.then.content (C:\Projects\travel-site\node_modules\postcss-import\index.js:238:12)

It typically works after I run gulp watch then when I added the & for the last nest it just gave another throw error and now it will not accept the last one. any advice would be helpful.

ai commented 6 years ago

Do you not close } in this CSS example?

georgemeehan commented 6 years ago

It's there I just didn't go down that far to copy it.

ai commented 6 years ago

Why do you think it is postcss-nested issue? Error message has postcss-import ;)

georgemeehan commented 6 years ago

Because when I start the nest with & it gives me the throw error.

ai commented 6 years ago

Sorry. You need to open an issue there. postcss-nested doesn’t parse anything. PostCSS parse & without any problem.

Be sure that you didn’t miss postcss-nesting and postcss-nested (cssnext has nesting not nested). postcss-nesting is based on top of Tab Atkin’s spec, which doesn’t allow & in the begging.