Articles of sass

Sass filewatcher for webstorm

我想在NodeJS项目中使用sass,这是我用nodejs安装的库 https://www.npmjs.org/package/node-sass 我正在使用webstorm这个项目,我不能让Sass文件监视器工作。 即使在我保存filewatcher并单击“确定”后,filewatcher不起作用。 当我打开设置来检查什么是错误的filewatcher已被取消选中。 这里是filewatcher设置: node-sass模块作为全局模块安装,因此node-sass命令可以工作。

Sourcemap“sources”数组链接到“../../stdin”而不是实际的SCSS文件

我今天跑npm update ,接下来是一场灾难。 我在安装软件包的时候遇到了麻烦,但是在所有的东西看起来都在正确的位置之后,我开始了我的gulp任务,把我的SCSS代码编译成CSS。 这段代码重现了我的问题: var gulp = require('gulp'), sourcemaps = require('gulp-sourcemaps'), sass = require('gulp-sass'); gulp.task('sass', function() { gulp.src('www/sass/*.scss') .pipe(sourcemaps.init()) .pipe(sass()) .pipe(sourcemaps.write('.')) .pipe(gulp.dest('www/css')); }); gulp.task('default', ['sass'], function(){ gulp.watch('www/sass/*.scss', {debounceDelay: 2000}, ['sass']); }); 在通过gulp default运行这段代码之后,结果如下: WWW / SASS / example.scss #test { color: red; } WWW / CSS / example.css #test { color: red; } /*# […]

Gulp突然编译得非常慢

最近,我无法理解,因为严格的stream水作业,我的编译时间变得非常慢。 他们现在平均每个编译18-20s,这是死亡缓慢。 我尝试从ruby-sass切换到node-sass,但是node-sass似乎不支持几乎任何我需要的(特别是映射)3.3 sass语法。 在他们全部在ms范围之前; 我从来没有记得他们甚至超过1秒。 这是我的sass任务文件: var gulp = require('gulp'); var sass = require('gulp-ruby-sass'); var autoprefixer = require('gulp-autoprefixer'); var minifycss = require('gulp-minify-css'); var notify = require('gulp-notify'); var rename = require('gulp-rename'); var handleErrors = require('../util/handleErrors'); var browserSync = require('browser-sync'); gulp.task('styl', function() { return gulp.src('styl/src/screen.scss') .pipe(sass({sourcemap: false, style: 'compact'})) .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', […]

gulp sass源地图

我需要帮助添加源地图到SASS编译器在同一个CSS输出文件夹。 到目前为止,我已经在gulpfile.js安装了gulp-sourcemaps模块,但是无法成功地将sourcemaps.write绑定为gulp.task。 任何帮助深表感谢 :) var gulp = require('gulp'); var sass = require('gulp-sass'); var sourcemaps = require('gulp-sourcemaps'); var bs = require('browser-sync').create(); gulp.task('browser-sync', ['sass'], function() { bs.init({ server: { baseDir: "./" }, proxy: { target: "localhost:8080", // can be [virtual host, sub-directory, localhost with port] ws: true // enables websockets } }); }); gulp.task('sass', function() { return […]

Symfony资产sassfilter通过节点sass?

我有一些困难得到一个资产sassfilter来使用node-sass而不是ruby的替代品。 我有我的config.yml文件中的以下configuration: assetic: debug: "%kernel.debug%" use_controller: false bundles: [ ] write-to: "%kernel.root_dir%/../web/assets" read_from: "%kernel.root_dir%/../web/assets" node: "%%PROGRAMFILES%%\nodejs\\node.exe" node_paths: ["%%USERPROFILE%%\\AppData\\Roaming\\npm\\node_modules"] sass: "%%USERPROFILE%%\\AppData\\Roaming\\npm\\node-sass" ruby: null filters: cssrewrite: ~ scss: output-style: compressed apply_to: "\.(scss|sass|css)%" 虽然这会触发正确的node-sass命令,但我不确定configuration是否正确。 如果我删除了ruby: null它会尝试运行C:\Program Files…\path\to\ruby.exe %%USERPROFILE%%\\AppData\\Roaming\\npm\\node-sass这是完全错误的。 但是, ruby: null也不能解决问题,因为它设置了错误的参数(即–load-path而不是–load-path –include-path ),也会造成混乱。 有谁知道如何设置sassfilter而不是ruby node ?

Node-Sass | 不重新编译,除非我手动删除css文件

我刚开始使用node-sass。 我已经到了我要求style.css的地步。 如果我的样式表目录中没有style.css,那么它会为我编译,但一旦编译完成,它将不会更新/重新编译更改,直到我手动删除css文件。 任何帮助,将不胜感激。 app.js /** * Module dependencies. */ var express = require('express'); var routes = require('./routes'); var user = require('./routes/user'); var http = require('http'); var path = require('path'); var sass = require('node-sass'); var app = express(); // all environments app.set('port', process.env.PORT || 3000); app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'jade'); app.use(express.favicon()); app.use(express.logger('dev')); app.use(express.json()); app.use(express.urlencoded()); […]

Node-sass不是在最新的node / express中自动编译的

使用节点(0.10.15)和expression式(3.3.4),以及最新的节点sass,我无法获得我的scss文件进行编译。 我的app.js文件如下所示: var express = require('express') , routes = require('./routes') , user = require('./routes/user') , http = require('http') , path = require('path') , sass = require('node-sass'); var app = express(); // all environments app.set('port', process.env.PORT || 3000); app.set('views', __dirname + '/views'); app.set('view engine', 'ejs'); app.use(express.favicon()); app.use(express.logger('dev')); app.use(express.bodyParser()); app.use(express.methodOverride()); app.use(express.cookieParser('your secret here')); app.use(express.session()); app.use(app.router); app.use(express.static(path.join(__dirname, 'public'))); […]

npm与节点sass和autoprefixer

我使用node-sass将所有的Sass文件编译为master.css。 这工作得很好,但现在我想添加前缀。 我只想使用npm,不使用Gulp或Grunt。 在这里我的package.json文件: { "name": "xxxxxx.com", "version": "1.0.0", "description": "", "watches": { "sass": "src/scss/**" }, "scripts": { "sass": "node-sass src/scss/master.scss -o dist/css/ –style compressed", "prefix": "postcss –use autoprefixer dist/css/master.css -d dist/css/master.css", "dev": "rerun-script" }, "author": "Jan", "license": "ISC", "devDependencies": { "autoprefixer": "^6.3.1", "browserify": "^13.0.0", "clean-css": "^3.4.9", "node-sass": "^3.4.2", "postcss-cli": "^2.5.0", "rerun-script": "^0.6.0", "uglifyjs": "^2.4.10" […]

在更新NodeJS之后使用node-sass发出问题

更新我的NodeJS版本后,我得到了一个使用node-sass的问题。 问题 : (node:472) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version. C:\aglqng\src\main\webapp\node_modules\node-sass\lib\index.js:15 throw new Error(errors.missingBinary()); ^ Error: Missing binding C:\aglqng\src\main\webapp\node_modules\node-sass\vendor\win32-x64-48\binding.node Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 6.x Found bindings for […]

如何configurationGrunt的目录recursionSass编译任务

我是一个新手,学习如何configuration咖啡,玉器和sass编译任务。 我可以成功地为咖啡和玉目录configuration编译任务,但我不能sass。 我的项目的结构是波纹pipe . ├── Gruntfile.coffee ├── node_modules ├── package.json ├── sass │ └── index.sass └── www 和我的package.json是 { "name": "grunt-sass-test", "version": "0.1.0", "devDependencies": { "grunt": "~0.4.1", "grunt-contrib-sass": "~0.5.0" } } 当Gruntfile.coffee在下面时, $ grunt sass编译index.css成功: module.exports = (grunt) -> grunt.initConfig pkg: grunt.file.readJSON('package.json') sass: compile: files:[ "www/index.css": "sass/index.sass" ] 但是如下所示, >>没有find源文件“index.sass”。 显示错误 sass: compile: cwd: 'sass' […]