zoukankan      html  css  js  c++  java
  • grunt-contrib-compass 编译sass

    grunt-contrib-compass的作用是编译sass文件为css。使用该插件需要先安装sass和compass。

    (1)安装sass
    gem install sass
    (2)安装compass
    gem install compass
    (3)执行 compass create webfans(项目名称),如果不带项目名称,则是在当前目录下生成一个项目结构:
    config.rb里面存储了基本的配置,css目录和sass目录
    (4)安装grunt的grunt-contrib-compass插件
    npm install grunt-contrib-compass --save-dev

    (5)配置Gruntfile.js

    grunt.initConfig({
      compass:{
        dist: {
          options:{
            config:'config.rb' //此文件路径相对于Gruntfile.js
          }
        }
      }
    });
    grunt.loadNpmTasks('grunt-contrib-compass');//加载指定插件任务
    grunt.registerTask('default',['compass']);//注册插件任务

    或 不使用config.rb文件

    grunt.initConfig({
      compass:{//compass任务
        dist:{//一个子任务
          options: {//任务设置
            sassDir: 'sass',
            cssDir: 'css',
            environment: 'production'
          }
        },
        dev: {//另一个任务
          options:{
            sassDir: 'sass',
            cssDir: 'style'
          }
        }
      }
    });
    grunt.loadNpmTasks('grunt-contrib-compass');//加载指定插件任务
    grunt.registerTask('default',['compass']);//注册插件任务
  • 相关阅读:
    Laravel 出现 No application encryption key has been specified.
    windows下用composer局部安装laravel
    vue组件--通讯录
    vue组件--TagsInput
    axios封装(二)队列管理
    axios封装(一)基础配置
    [git hooks] pre-commit 配置
    qs.js
    flexbox的应用
    盒子模型详解
  • 原文地址:https://www.cnblogs.com/cyj7/p/4838556.html
Copyright © 2011-2022 走看看