Correct way to install singularity with bower? - sass

I'm running in some troubles installing singularity in my yeoman gulp-webapp project. First, I installed singularity with bower.
After that I had a projekt structure like this:
My Projekt
app
bower_components
compass_breakpoint
sassy-maps
singularity
styles
main.scss
Then I imported singularity into my main.scss file like this:
#import "../bower_components/singularity/stylesheets/singularitygs";
In _singularity.scss I corrected the import path for breakpoint to:
#import "../../compass-breakpoint/stylesheets/breakpoint";
If I run gulpnow in the terminal I get this strange error:
[gulp] Error in plugin 'gulp-ruby-sass':
Syntax error: Invalid CSS after "...ntext holder') ": expected "}", was "!global;"
on line 47 of /Users/Shared/Dropbox/Server/htdocs/Frameworks/my-project/app/bower_components/compass-breakpoint/stylesheets/_breakpoint.scss
from line 4 of /Users/Shared/Dropbox/Server/htdocs/Frameworks/my-project/app/bower_components/singularity/stylesheets/_singularitygs.scss
from line 1 of /Users/Shared/Dropbox/Server/htdocs/Frameworks/my-project/app/styles/main.scss
at ChildProcess.<anonymous> (/Users/Shared/Dropbox/Server/htdocs/Frameworks/my-project/node_modules/gulp-ruby-sass/index.js:80:25)
at ChildProcess.EventEmitter.emit (events.js:98:17)
at maybeClose (child_process.js:743:16)
at Socket.<anonymous> (child_process.js:956:11)
at Socket.EventEmitter.emit (events.js:95:17)
at Pipe.close (net.js:466:12)
Did anyone have an idea how to get this setup running?
Thanks, Oli

While you can install Singularity through Bower, you need to make sure you're running a compiler that's compatible with Sass 3.3. The best way to ensure you are in fact using the correct version of Sass is to version your Ruby with Bundler. Your Gemfile should look something like the following:
source 'https://rubygems.org'
gem "sass", "~>3.3.0.rc.3"
Then make sure that Gulp Ruby Sass is running through bundleExec

Related

Next JS: unable to use scss on Windows

I am building a Next JS application. To admit, this is my first exposure to Next JS. Now, I am having a problem using SCSS with my Next JS application. I have created a file called, assets/auth.scss. Then I imported it into pages/_app.js as follow.
import '../assets/auth.scss';
When I run "npm run dev", I am getting the following error.
./node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[7].use[1]!./node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[7].use[2]!./node_modules/nex
t/dist/compiled/resolve-url-loader/index.js??ruleSet[1].rules[2].oneOf[7].use[3]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[2].oneOf[7].use[4]!./assets/auth.scss
Error: Node Sass version 6.0.1 is incompatible with ^4.0.0 || ^5.0.0.
Error: Cannot find module 'C:\Users\Acer\Desktop\shar-kya-mal-next-js\nextjs-blog\.next\build-manifest.json'
Require stack:
Then I tried installing node-sass package too. It still does not work. How can I fix it?
Do you use npm install sass or node sass? Every next project where i will use scss i use npm install sass and it works normally. Do you do something different?
Try to use npm install sass or yarn install sass

Dart/sass on OSX 10.13.3 "Cannot open file"

In trying to learn/use sass for 1st time, I used Homebrew to install dart-sass on recently updated High Sierra 10.13.3 . That worked and sass --version shows 1.1.1 I created a simple .scss file:
$color: #d9534f;
body {
color: $color;
}
and while in the same directory, then issued:
sass main.scss main.css --trace
in console and got:
Error reading main: Cannot open file.
dart:io _File.readAsBytesSync
package:sass/src/io/vm.dart 27 readFile
package:sass/src/compile.dart 33 compile
package:sass/sass.dart 63 compile
package:sass/src/executable.dart 110 main
What do I need to change, learn or do to get this working?
Oops. Reinstall. I ran
brew update multiple times, then
brew uninstall sass then
brew install --devel sass/sass/sass
and now
sass main.scss main.css
works.

My compass has stopped working together with Grunt

Im using sass and compass together with Grunt to build my project. But suddenly compass has just stopped working. When i run my Grunt i get this error:
"Running "sass:dist" (sass) task
ERROR: Cannot load compass.
Warning: Exited with error code 1 Use --force to continue."
The versions are:
compass (0.12.4)
sass (3.2.18)
I have googled ant tried a lot of stuff but none seems to work for me.
Any suggestions?

Sass Compilation Error

I am trying to compile my Sass file, but keep getting this error in my terminal:
error sass/app.scss (Line 60: File to import not found or unreadable:
custom.
This happened after:
cd to the containing folder
sass --watch `sass:css`
What did I do wrong? What steps should I take? Do I need to use Compass to use Sass?

Docpad error after Sass install

I want to start to work with foundation 4. So I installed Ruby and Sass.
After I installed Sass gem, I get the following error message on docpad generate:
error: An error occured:
Error: spawn ENOENT
at errnoException (child_process.js:948:11)
at Process.ChildProcess._handle.onexit (child_process.js:739:34)
→ [2013-05-31 13:23:20.812] [C:\Users\USERDIR\AppData\Roaming\npm\node_modules\docpad\out\lib\docpad.js] [DocPad.log]
error: An error occured:
Error: spawn ENOENT
at errnoException (child_process.js:948:11)
at Process.ChildProcess._handle.onexit (child_process.js:739:34)
→ [2013-05-31 13:23:20.820] [C:\Users\USERDIR\AppData\Roaming\npm\node_modules\docpad\out\lib\docpad.js] [DocPad.log]
I'd like to use sass for generating foundation inside docpad.
I've tried to use this foundation docpad skeleton: https://github.com/axyz/zurb-foundation.docpad
What can cause this and how could I solve it?
a bit old question, however I've just updated https://github.com/axyz/zurb-foundation.docpad in order to support foundation v4.3.2 right now it seems to work well.
however I had to switch from pure sass to the nodesass implementation (keeping updated manually the source of foundation, maybe it could be switched to a git submodule). I had to switch not only for performance reason, but also because i had problems with the sass plugin: it just get stuck during docpad run whenever there is some file to parse like example.css.scss
It's likely the same as this issue - https://github.com/docpad/docpad-plugin-sass/issues/6 - that being that DocPad was unable to automatically detect your sass installation path, so you'll have to specify it manually by adding the following to your docpad configuration file
plugins:
sass:
sassPath: 'theValue'
scssPath: 'theValue'
compass: 'theValue'

Resources