`
yutiansky
  • 浏览: 198136 次
  • 性别: Icon_minigender_1
  • 来自: 本溪
社区版块
存档分类
最新评论

Compass/Sass编译ExtJS4.0

 
阅读更多

◆環境

 Ruby - 1.9.3

 Compass - 0.11.7

 Sass - 3.1.1

 

◆手順

 ・Rubyをインストール

  ⇒http://rubyforge.org/frs/download.php/75465/rubyinstaller-1.9.3-p0.exe


  ⇒インストールする時、PATHに設定する。


 

 

 ・Compassをインストール

  ⇒コマンドラインで gem を利用し、compassをインストール

gem install --http-proxy http://proxy.fxis.co.jp:8080 compass

 

 

 

  ⇒バージョンを確認する。

 

C:\Users\dnc>compass -v

Compass 0.11.7 (Antares)
Copyright (c) 2008-2012 Chris Eppstein
Released under the MIT License.
Compass is charityware.
Please make a tax deductable donation for a worthy cause: http://umdf.org/compass
 
C:\Users\dnc>sass -v

Sass 3.1.12 (Brainy Betty)

 

 

  ⇒Sass v 3.1.12をアンインストールし、Sass v 3.1.1をインストールする。(ExtJS4.0は、Sass v 3.1.1をサポートするので)

 

 

 

C:\Users\dnc>gem uninstall sass -v 3.1.12

You have requested to uninstall the gem:
        sass-3.1.12
compass-0.11.7 depends on [sass (~> 3.1)]
If you remove this gems, one or more dependencies will not be met.
Continue with Uninstall? [Yn]  y

Remove executables:
        sass, sass-convert, scss

in addition to the gem? [Yn]  y

Removing sass
Removing sass-convert
Removing scss
Successfully uninstalled sass-3.1.12
 

 

C:\Users\dnc>gem install --http-proxy http://proxy.fxis.co.jp:8080 sass -v 3.1.1

Fetching: sass-3.1.1.gem (100%)
Successfully installed sass-3.1.1
1 gem installed
Installing ri documentation for sass-3.1.1...
Installing RDoc documentation for sass-3.1.1...

C:\Users\dnc>sass -v

Sass 3.1.1 (Brainy Betty)
 

 ・ExtJSをビルド

  ⇒http://cdn.sencha.io/ext-4.0.7-gpl.zip


 

  ⇒「$ExtJS展開先フォルダ/resources/sass」フォルダで、「compass compile」コマンドを実行し、ビルドする。

  ⇒ビルドの結果は、「$ExtJS展開先フォルダ/resources/css」フォルダにある。


 

 

//END

 

  • 大小: 83.9 KB
  • 大小: 66.4 KB
  • 大小: 68.4 KB
  • 大小: 131 KB
  • 大小: 73.2 KB
分享到:
评论

相关推荐

    Sass编译神器:koala

    而提到Sass的编译工具,就不能不提及“Sass编译神器”——Koala。本文将详细介绍Koala及其2.0.3版本的功能与使用方法。 **Koala简介** Koala是一款免费开源的图形界面应用,专为开发者设计,支持Sass、Less、...

    compass-sass-html5boilerplate:在HTML5 Boilerplate之上使用Compass + SASS引导静态Web项目

    为了使您在/ compass / sass / css中所做的编辑能够自动编译,请在/ compass文件夹中运行watcher命令compass watch 。 然后,您对SASS(.scss)文件所做的所有更改都将被编译到/ css文件夹中。 CSS文件(/ css) ...

    wordpress-jade-bootstrap-template:使用Gulp和Jade,Sass和Compass创建WordPress主题的模板,并支持Bootstrap

    使用Bootstrap的空白Gulp / Jade / Compass / Sass模板WordPress主题描述此主题针对Web专业人士,但是任何人都可以使用。 WordPress主题的基本要素,未添加CSS样式。 对于那些想从头开始构建自己的主题的人来说,是...

    前端开源库-compass-mixins

    3. **CSS3 功能**:Compass Mixins 包含了众多 CSS3 特性的预定义混合,比如阴影(`compass/css3/shadow`)、渐变(`compass/css3/linear-gradient` 和 `compass/css3/radial-gradient`)、过渡(`compass/css3/...

    Sass和Compass 实战

    @import "compass/layout/viewport"; .content { @include respond-to(small) { width: 100%; } @include respond-to(medium) { width: 75%; } } ``` 2. **样式库**:包含了大量的样式组件,如按钮、...

    COMPASS/GPS双模导航定位精度分析及仿真

    结合北斗二号( COMPASS) 和GPS 系统的运行轨道参数及系统特性, 建立了COMPASS/ GPS 双模导航定位伪距测量误差模型, 推导分析了双系统定位的几何误差因子; 并对某地区的 COMPASS /GPS 双模导航定位精度进行了...

    Sass和Compass设计师指南 中文扫描完整版

    Sass和 Compass设计师指南是中文扫描完整版

    前端开源库-gulp-compass

    **gulp-compass** 是一个基于 **Gulp** 的插件,用于自动化地编译 **Compass** 框架中的 **Sass** 文件。在前端开发中,Sass 是一种预处理器,它扩展了 CSS 语言,添加了变量、嵌套规则、混合、函数等强大特性,使得...

    compass-watch-docker-container

    它使用 Compass编译 sass 或 scss 文件 它打算在你的开发机器上运行,所以每次你的 sass 源代码发生变化时,它都会将 css 编译到你在config.rb文件中配置的输出文件夹中。 如何使用此图像 设置 首先,您需要在config...

    初步评估的COMPASSBeiDou-2区域导航卫星系统

    本篇文献提出了对COMPASS/BeiDou-2系统初步评估,涵盖了多方面技术和性能表现。 首先,文献中提到了 COMPASS/BeiDou-2 系统的信号及测量质量分析。2012年3月,研究者通过一个小范围内的监测站网络收集了最多三频的...

    Sass and Compass In Action

    《Sass和Compass In Action》是一本专注于Sass和Compass技术的实践指南书籍,旨在教授读者如何将这两种技术应用于实际项目开发中,特别是在使用ExtJS 4框架开发Web应用时的样式表美化工作。 Sass(Syntactically ...

    Sass和Compass设计师指南pdf+源码

    《Sass和Compass设计师指南》是一本专为前端开发者和设计师编写的深入解析Sass和Compass技术的专业书籍。Sass(Syntactically Awesome Style Sheets)是一种强大的CSS预处理器,它扩展了CSS语法,增加了变量、嵌套...

    extjs 开发工具

    - Sencha Cmd是EXTJS的主要命令行工具,用于自动化EXTJS项目构建过程,包括创建应用、管理依赖、编译SASS样式、压缩JavaScript代码等。 - 版本4.0.2.67是Sencha Cmd的一个早期版本,它支持EXTJS的早期版本,帮助...

    sass与compass实战--源代码

    7. **编译与工作流**:了解如何设置SASS编译器(如Ruby Sass或LibSass),以及如何将SASS文件自动化编译为CSS,是实际项目中的重要一环。你可以使用Gulp、Grunt或Webpack等构建工具实现这一过程。 8. **调试与优化*...

    COMPASS_GPS组合导航系统定位精度分析.pdf

    5. COMPASS/GPS组合导航系统的优点:COMPASS/GPS组合导航系统可以提高定位精度和稳定性,提高用户的可靠性和效率。该系统可以在多种环境下工作,包括城市、山区和海上等。 6. 定位精度分析:本文通过48小时观测数据...

    Sass和Compass设计师指南源代码

    《Sass和Compass设计师指南源代码》是一个深入解析Sass和Compass技术的资源集合,包含多个章节的源码示例,旨在帮助设计师更好地理解和应用这两种强大的CSS预处理器。Sass(Syntactically Awesome Style Sheets)是...

    Sass和Compass设计师指南

    Sass和Compass设计师指南 AZW3文字版本,更清晰,非PDF版 Sass and Compass for Designers

    roots-haml-compass-coffeescript:[Abandonware] Roots with Boostrap SASS、Coffeescript 和模板的 HAML 文件!

    为 Bootstrap SASS、HAML、Compass 和 Coffeescript 修改的 ##与原始根的区别 grunt-haml-php - 针对最新版本的 MTHAML 进行了修改并修复了编译和 (不依赖于packages.json!) assets/sass - SASS 文件夹 assets/...

    grunt-contrib-compass:将Compass编译为CSS

    grunt-contrib-compass v1.1.1 使用Compass将Sass编译为CSS入门如果您以前从未使用过 ,请务必查看《指南》,因为它说明了如何创建以及安装和使用Grunt插件。 熟悉该过程后,可以使用以下命令安装此插件: npm ...

Global site tag (gtag.js) - Google Analytics