use compass function in scss - ruby

I have download all of the compass source,import it to scss,and compile with gulp(gulp-sass).however,I was having problems compile it.the gulp-sass through error:
Error: Undefined operation: "prefix-usage(browser-prefixes(browsers()), background-img-opts, (full-support: true), (partial-support: true)) gt 0.01".
on line 324 of src/lib/_support.scss
After reviewing the official documentation, I found that the prefix-usage method is based on ruby and is compass-specific and not found in scss functions. This is my screenshot
I tried to find the source of this function in ruby, but unfortunately I did not find it.
Is there any solution that will allow me to migrate the compass project to gulp-sass as a whole?thanks for help.

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

Error compiling sass in vscode with DartJS Sass Compiler extension

I'm trying to implement a project using Bulma, but I'm hitting the following error when the extension tries to compile the sass files:
Error: Run: Cwd: /Users/.../Projects/.... Exec: node-modules/.bin/sass
`stylesheets/styles.scss:stylesheets/styles.css did not launch correctly. pid is null / undefined - undefined`
I've not been able to find any solution or reference to this by googling, so I'd be really grateful if someone can give me a tip.
Thanks
The developer helped me with the solution. See here

Why is the following sass code giving me an error?

(.sass)
div
background-color: cyan
Build error: Transform Sass on dart_gol|lib/forms_menu.sass threw
error: Invalid CSS after "...und-color: #333": expected "{", was ""
on line 6 of standard input
I have Sass installed:
sass --version
"Sass 3.4.22 (Selective Steve)"
I just began using the Sass transformer using pub. I got that error; then went back to --watch . (using Sass via terminal) to see if it happened there. The error was the same both times.
I'm using a .sass extension and it is giving me the problem. I'm using the Sass Basics as a guide.
I did not have a problem when using .scss, with the bracket formatting. I'm not sure why .sass has a problem.
The problem appears to be in the dart_sass_transformer. It isn't properly compiling the sass into css.
Turning off the transformer (removing it from the pubspec) and running sass via Terminal is working properly.
The code in question is just fine.
It tells you it was expecting {
What you need is:
div {
background-color: cyan
}

Can't import compass' mixins with foundation 6 and gulp

I followed the foundation tutorial to create a new project. So I compile and watch the sass files with foundatoin watch which compile my files and stream the output to the localhost but I get this error when I am trying to import compass by typing #import "compass"; :
Error in plugin 'sass'
Message:
src\assets\scss\app.scss
Error: File to import not found or unreadable: compass
Parent style sheet: C:/Users/Kevin/Dropbox/Work/Perso/2016_01_KMStudio Site/km_website/src/assets/scss/app.scss
on line 7 of src/assets/scss/app.scss
>> #import "compass";
I am really a newbie to gulp, gem and all this stuff, so I tried to add compass by running bower install compass but this doesn't help. I already installed compass with gem by running gem install compassand this doesn't fix the problem.
So I searched to modify the gulp file, but I don't know anything about it, I found this post and I tried to add .pipe(sass({ compass: true, sourcemap: true, style: 'compressed' })) into my sass pipe. And this leads me to this error:
'sass' errored after 7.62 s
[19:33:49] TypeError: Cannot read property 'isFile' of undefined
at isFile (C:\Users\Kevin\Dropbox\Work\Perso\2016_01_KMStudio Site\km_website\node_modules\gulp-load-plugins\node_modules\resolve\lib\sync.js:12:20)
at loadAsFileSync (C:\Users\Kevin\Dropbox\Work\Perso\2016_01_KMStudio Site\km_website\node_modules\gulp-load-plugins\node_modules\resolve\lib\sync.js:42:17)
at loadAsDirectorySync (C:\Users\Kevin\Dropbox\Work\Perso\2016_01_KMStudio Site\km_website\node_modules\gulp-load-plugins\node_modules\resolve\lib\sync.js:68:16)
at loadNodeModulesSync (C:\Users\Kevin\Dropbox\Work\Perso\2016_01_KMStudio Site\km_website\node_modules\gulp-load-plugins\node_modules\resolve\lib\sync.js:77:21)
at Function.module.exports [as sync] (C:\Users\Kevin\Dropbox\Work\Perso\2016_01_KMStudio Site\km_website\node_modules\gulp-load-plugins\node_modules\resolve\lib\sync.js:27:17)
at requireFn (C:\Users\Kevin\Dropbox\Work\Perso\2016_01_KMStudio Site\km_website\node_modules\gulp-load-plugins\index.js:64:25)
at Object.defineProperty.get [as sourcemaps] (C:\Users\Kevin\Dropbox\Work\Perso\2016_01_KMStudio Site\km_website\node_modules\gulp-load-plugins\index.js:103:41)
at sass (C:/Users/Kevin/Dropbox/Work/Perso/2016_01_KMStudio Site/km_website/gulpfile.babel.js:79:11)
at sass (C:/Users/Kevin/Dropbox/Work/Perso/2016_01_KMStudio Site/km_website/gulpfile.babel.js:80:11)
at sass (C:/Users/Kevin/Dropbox/Work/Perso/2016_01_KMStudio Site/km_website/gulpfile.babel.js:80:11)
Since I know nothing about gulp, streaming and sass compiling, I am wondering if someone could help me to add compass' mixins to my project. I am on Windows.

Use Map Data Type with Compass [duplicate]

This question already has answers here:
Is Sass 3.3 compatible with Compass?
(3 answers)
Closed 7 years ago.
I am using Compass with Sass (v 3.3 Maptastic Maple) and I am trying to use the new maps data structure. I am using grunt watch with compass, however when using the new maps syntax, it throws an error everytime I run grunt.
$colors: (
header: #b06,
text: #334,
footer: #666777
);
This is the error:
error sass/main.scss (Line 73 of sass/base/_variables.scss: Invalid CSS after " header": expected ")", was ": #b06,")
How can I use the new sass maps with compass?
I managed to get compass to compile the new syntax by installing the alpha of the latest version.
gem install compass --pre
Should do the trick.
I had the same issue with you, and after few hours of trying and googling, I found 2 solutions:
If you can, use grunt-contrib-sass instead.
But if you need to use grunt-contrib-compass, check the answer at this one Is Sass 3.3 compatible with Compass?

Resources