json Gulp和Libsass首发。 1. npm安装2. bower安装
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了json Gulp和Libsass首发。 1. npm安装2. bower安装相关的知识,希望对你有一定的参考价值。
//
// Base.
//
// Bower components.
//========================================//
// Susy.
// Your markup, your design, your opinions | Our math.
// http://susy.oddbird.net
@import "../bower_components/susy/sass/susy";
// Breakpoint.
// Really Simple Media Queries with Sass.
// + https://github.com/at-import/breakpoint
@import "../bower_components/compass-breakpoint/stylesheets/breakpoint";
// Toolkit.
// Progressive Enhancement? Simple. Responsive Web Design? Done. Design in
// Browser? Beautiful.
// + https://github.com/at-import/toolkit
@import "../bower_components/sass-toolkit/stylesheets/toolkit/_kickstart.scss";
@import "../bower_components/sass-toolkit/stylesheets/toolkit/_clearfix.scss";
// Font Awsome.
// The iconic font and CSS toolkit.
// + https://fortawesome.github.io/Font-Awesome/
@import "../fonts/font-awesome/scss/font-awesome.scss";
// Styling.
//========================================//
// Variables.
@import "base/_breakpoint.scss";
@import "base/_colors.scss";
// Typography.
@import "base/_fonts.scss";
// Utilities.
@import "utils/_functions.scss";
@import "utils/_mixins.scss";
@import "utils/_helpers.scss";
// Import components.
@import "components/*";
{
"name": "lf-gulp-dependencies",
"version": "1.0.0",
"description": "Linux Foundation Gulp Dependencies",
"main": "gulpfile.js",
"scripts": {
"postinstall": "find node_modules/ -name '*.info' -type f -delete"
},
"author": "Jeremy Caldwell",
"homepage": "http://www.eternalistic.net",
"dependencies": {
"browser-sync": "^2.10.0",
"gulp": "^3.9.0",
"gulp-autoprefixer": "~3.1.0",
"gulp-imagemin": "^2.4.0",
"gulp-livereload": "^3.8.1",
"gulp-plumber": "^1.0.1",
"gulp-sass": "^2.1.0",
"gulp-sass-glob": "0.0.2",
"imagemin-pngquant": "^4.2.0"
}
}
/**
*
* The packages we are using.
* Not using gulp-load-plugins as it is nice to see whats here.
*
**/
var gulp = require('gulp');
var sass = require('gulp-sass');
var sassGlob = require('gulp-sass-glob');
var autoprefixer = require('gulp-autoprefixer');
var plumber = require('gulp-plumber');
var browserSync = require('browser-sync');
var livereload = require('gulp-livereload');
var imagemin = require('gulp-imagemin');
var pngquant = require('imagemin-pngquant');
// Path.
path = require('path');
/**
*
* Styles.
* - Compile.
* - Autoprefixer.
* - Catch errors (gulp-plumber).
*
**/
gulp.task('sass', function() {
gulp.src('sass/**/*.{scss,sass}')
.pipe(sassGlob())
.pipe(sass({
outputStyle: 'expanded',
includePaths: [
path.join(__dirname, 'bower_components/support-for/sass')
]
}))
.pipe(autoprefixer({
browsers: ['last 2 versions'],
cascade: false
}))
.pipe(plumber())
.pipe(gulp.dest('css'))
// .pipe(browserSync.stream())
.pipe(livereload())
});
/**
*
* BrowserSync.io
* - Watch CSS and JS for changes
* - View project at: localhost:3000
*
**/
//gulp.task('browser-sync', ['sass'], function() {
// browserSync.init({
// proxy: 'd67-p53-prod-ol.local'
// });
// gulp.watch('./sass/**/*.{scss,sass}', ['sass'])
// gulp.watch('js/**/*.js');
// });
/**
*
* Images
* - Compress them!
*
**/
gulp.task('images', function () {
return gulp.src('images/*')
.pipe(imagemin({
progressive: true,
svgoPlugins: [{removeViewBox: true}],
use: [pngquant()]
}))
.pipe(gulp.dest('images'));
});
/**
*
* Default task.
* - Runs Sass, scripts, and images.
* - Prepares all files for deployment.
*
**/
gulp.task('default', ['sass', 'images']);
/**
*
* Watch task.
* - Runs Sass and scripts.
* - Watchs for file changes for sass and scripts.
* - Refreshes browser after files have been compiled.
*
**/
gulp.task(
'watch', [
'sass'
],
function () {
gulp.watch('./sass/**/*.{scss,sass}', ['sass'])
gulp.watch('js/**/*.js');
livereload.listen();
}
);
{
"name": "Linux Foundation Bower Dependencies",
"version": "0.0.1",
"authors": [
"Jeremy Caldwell <jeremy@eternalistic.net>"
],
"license": "MIT",
"ignore": [
"**/.*",
"node_modules",
"bower_components"
],
"dependencies": {
"susy": "~2.2.6",
"compass-breakpoint": "breakpoint-sass#~2.6.1",
"support-for": "~1.0.3"
},
"devDependencies": {
"sass-toolkit": "~2.9.0"
}
}
以上是关于json Gulp和Libsass首发。 1. npm安装2. bower安装的主要内容,如果未能解决你的问题,请参考以下文章
节点 0.12.2 上的节点 sass 2.1.1:找不到“libsass”绑定。尝试重新安装 `node-sass`