gulp + foundation(sass版本)使用错误
Error in using gulp + foundation (sass version)
我想使用 gulp + Foundation 6 + browserify。
当 运行 gulp 在 cli 中时,我在终端
中出现此错误
write ./scss.css/foundation.css
path.js:7
throw new TypeError('Path must be a string. Received ' + inspect(path));
^
TypeError: Path must be a string. Received undefined
at assertPath (path.js:7:11)
at Object.join (path.js:1211:7)
at exports.replaceLocation (/Applications/MAMP/htdocs/Jober/node_modules/gulp-ruby-sass/lib/utils.js:32:14)
at /Applications/MAMP/htdocs/Jober/node_modules/gulp-ruby-sass/index.js:179:13
at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:416:3)
我的 gulpfile.js 是:
var gulp = require ('gulp'),
logger = require ('gulp-util'),
concat = require ('gulp-concat'),
minifyCSS = require ('gulp-minify-css'),
compileSass = require ('gulp-ruby-sass');
var scss_sources,
input_address,
output_address;
// Input and Output Address
input_address = 'asstes/src/';
output_address = 'asstes/dist/';
// Style Sources
scss_sources = [
'node_modules/foundation-sites/scss',
input_address + 'style/style.scss'];
gulp.task('styles', function(){
return compileSass(scss_sources, { style: 'expanded' })
.pipe(autoprefixer({
browsers: ['last 2 versions', 'ie >= 9', 'and_chr >= 2.3'],
cascade: false
}))
.pipe(minifyCSS())
.on('error', logger.log)
.pipe(gulp.dest(output_address + 'style'));
});
gulp.task('watch', function(){
gulp.watch(input_address + 'style/pages/*.scss', ['styles']),
});
gulp.task('default', ['styles' , 'watch']);
我的 style.scss 是:
//Modules
@import 'foundation';
//Pages
@import 'pages/index';
我的文件夹结构是:
PROJECT FOLDER
|
|_assets
| |_dist
| | |_img
| | |_js
| | |_style
| |
| |_src
| |_img
| |_js
| |_style
|
|_node_modules
| |_foundation-site
|
|_gulpfile.js
我曾在 gulp-ruby-sass 之前使用过 gulp-compass,但出现了常见错误:Individual stylesheets must be in the sass directory
,因此将插件更改为gulp-ruby-sass.
我该如何解决?
可能是 scss_sources
中的字符串连接不正确。
尝试将 scss_sources 更改为:
scss_sources = [
'node_modules/foundation-sites/scss',
'asstes/src/style/style.scss'
];
看看是否可行,如果可行,那就是串联。
我想使用 gulp + Foundation 6 + browserify。 当 运行 gulp 在 cli 中时,我在终端
中出现此错误write ./scss.css/foundation.css
path.js:7
throw new TypeError('Path must be a string. Received ' + inspect(path));
^
TypeError: Path must be a string. Received undefined
at assertPath (path.js:7:11)
at Object.join (path.js:1211:7)
at exports.replaceLocation (/Applications/MAMP/htdocs/Jober/node_modules/gulp-ruby-sass/lib/utils.js:32:14)
at /Applications/MAMP/htdocs/Jober/node_modules/gulp-ruby-sass/index.js:179:13
at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:416:3)
我的 gulpfile.js 是:
var gulp = require ('gulp'),
logger = require ('gulp-util'),
concat = require ('gulp-concat'),
minifyCSS = require ('gulp-minify-css'),
compileSass = require ('gulp-ruby-sass');
var scss_sources,
input_address,
output_address;
// Input and Output Address
input_address = 'asstes/src/';
output_address = 'asstes/dist/';
// Style Sources
scss_sources = [
'node_modules/foundation-sites/scss',
input_address + 'style/style.scss'];
gulp.task('styles', function(){
return compileSass(scss_sources, { style: 'expanded' })
.pipe(autoprefixer({
browsers: ['last 2 versions', 'ie >= 9', 'and_chr >= 2.3'],
cascade: false
}))
.pipe(minifyCSS())
.on('error', logger.log)
.pipe(gulp.dest(output_address + 'style'));
});
gulp.task('watch', function(){
gulp.watch(input_address + 'style/pages/*.scss', ['styles']),
});
gulp.task('default', ['styles' , 'watch']);
我的 style.scss 是:
//Modules
@import 'foundation';
//Pages
@import 'pages/index';
我的文件夹结构是:
PROJECT FOLDER
|
|_assets
| |_dist
| | |_img
| | |_js
| | |_style
| |
| |_src
| |_img
| |_js
| |_style
|
|_node_modules
| |_foundation-site
|
|_gulpfile.js
我曾在 gulp-ruby-sass 之前使用过 gulp-compass,但出现了常见错误:Individual stylesheets must be in the sass directory
,因此将插件更改为gulp-ruby-sass.
我该如何解决?
可能是 scss_sources
中的字符串连接不正确。
尝试将 scss_sources 更改为:
scss_sources = [
'node_modules/foundation-sites/scss',
'asstes/src/style/style.scss'
];
看看是否可行,如果可行,那就是串联。