使用sass命令行,包含bourbon,neat包的项目

1.安装ruby;

2.安装sass;

3.建立项目,蓝色是建立的文件和文件夹;

2。要在项目中使用bourbom,neat,就在命令行使用gem获取,再安装。cd 打开0-plugins文件,在这个路径下执行以下命令:命令执行后,生成bourbon和neat文件夹。

gem install bourbon
bourbon install
gem install neat
neat install

3.在文件0-plugin/plugins-dir.scss里面包含这两个插件:

@import ‘bourbon/bourbon‘;
@import ‘neat/neat‘

这里需要说明一下这个项目的路径包含方案:文件有-dir,结尾的都是包含所在文件夹里的文件路径;而app.scss里面就包含这些-dir文件的路劲;app.scss文件内容:

@import ‘0-plugins/plugins-dir‘;
@import ‘1-base/base-dir‘;
@import ‘2-modules/modules-dir‘;
@import ‘3-layouts/layouts-dir‘;

4.搞清楚了文件的路径,现在看看怎样用sass指令编译把scss文件编译为css文件,刚刚不是有一个包含所有文件路径的app.scss文件吗,但是我们需的是css文件,在css路径下,使用命令:这个命令是使得css路径下的app.scss被监视了,只要app.scss的变化被保存了,那么,app.css就自动更新,忘记说了,这个app.css是在这个命令执行之后自动生成的。

sass --watch app.scss:app.css

注意:这里算是有一个让我头疼的点,就是,你编译的是scss文件,不是sass文件,这两个都是正确的文件类型,只是有严格的语法区分。一般我编译的是scss文件,因为,scss文件是兼容css语法,这样就不用转换以前写css的思路习惯了。

5.index.html使用的样式:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>E</title>
        <link rel=‘stylesheet‘ href="css/app.css">
    </head>
    <body>
        <div class=‘boxes‘>
            <div class=‘box‘></div>
            <div class=‘box‘></div>
            <div class=‘box‘></div>
            <div class=‘box‘></div>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga, officiis sunt neque facilis culpa molestiae necessitatibus delectus veniam provident.</p>
        </div>
    </body>
</html>

  

  

时间: 2024-10-23 15:05:09

使用sass命令行,包含bourbon,neat包的项目的相关文章

利用命令行引用外部jar包以使程序正常运行的4种方法

声明:本博客为原创博客,未经允许,不得转载!原文链接为http://blog.csdn.net/bettarwang/article/details/30976069 平时写一些小的Java Demo时我比较喜欢用UltraEdit或记事本写完后,直接利用命令行进行编译和运行.这样的好处就是方便快捷.相信有这个习惯的人应该还大有人在.但是如果要引用外部jar包,应该如何操作呢?在写JDBC的一些Demo时,由于要利用jar包来加载相应的数据库,每个Demo都用到了外部jar包,所以特地总结了一下

mac命令行对复杂ipa包重新签名

最近在做ios的自动化平台,需要通过命令行安装卸载ipa包 好了问题来,别人上传的ipa包,很可能是开发签名了只能在特定手机上安装的测试ipa包,那我们如何将其安装在我们的自动化的iphone上呢? 答案看起来显而易见,将其重新签名,但是我们是自动化平台,总不能手动签名所以需要使用mac的命令行将其重新签名 这是我第一版代码: #!/bin/bash echo $1 cd uploadfiles unzip $1 rm -rf $1 cd Payload a=`ls|sed 's/[ ][ ]*

利用命令行引用外部jar包以使程序正常执行的4种方法

声明:本博客为原创博客.未经同意.不得转载!原文链接为http://blog.csdn.net/bettarwang/article/details/30976069 平时写一些小的Java Demo时我比較喜欢用UltraEdit或记事本写完后,直接利用命令行进行编译和执行.这种优点就是方便快捷.相信有这个习惯的人应该还大有人在. 可是假设要引用外部jar包.应该怎样操作呢?在写JDBC的一些Demo时.因为要利用jar包来载入对应的数据库.每一个Demo都用到了外部jar包,所以特地总结了一

Go命令行参数解析flag包

go语言提供的flag包可以解析命令行的参数,代码: package main import ( "flag" "fmt" ) func main() { //第一个参数,为参数名称,第二个参数为默认值,第三个参数是说明 username := flag.String("name", "", "Input your username") flag.Parse() fmt.Println("Hell

命令行参数(flag包)

命令行参数 命令行参数可以直接通过 os.Args 获取,另外标准库的 flag 包专门用于接收和解除命令行参数 os.Args 简单的只是从命令行获取一个或一组参数,可以直接使用 os.Args.下面的这种写法,无需进行判断,无论是否提供了命令行参数,或者提供了多个,都可以处理: // 把命令行参数,依次打印,每行一个 func main() { for _, s := range os.Args[1:] { fmt.Println(s) } } flag 基本使用 下面的例子使用了两种形式的

命令行编译带外部包依赖的java源文件 [以JDBC MySQL8为例]

环境: MySQL8 JDK11(SE) 首先下载MySQL8的JDBC驱动 https://dev.mysql.com/downloads/connector/j/选 PlatForm Independent 下载完文件名差不多是 “mysql-connector-java-8.<小版本号>.jar” 然后写一个JDBC小的程序(需要数据库提前建好表) 1 import java.sql.Connection; 2 import java.sql.DriverManager; 3 impor

命令行记录-初始Proj4包以及栅格数据投影转换

1.本篇内容包含两个部分,一是使用PROJ4包对点进行投影转换,二是栅格数据投影转换的示例 2. #3\另外一个投影包PROJ4from pyproj import Proj,Geod,transform #projection1:UTM zone15, grs80 ellipse, NAD83 datum#(defined by epsg code 26915)p1=Proj(init='epsg:26915')#projection2:UTM zone 15,clrk66 ellipse,

使用fatjar来实现将包含第三方jar包的项目到处成一个jar包供其他程序使用

一.在线安装fat jar 在线安装步骤: eclipse菜单栏 help >software updates >Search for new features to install>new update site> 填写name 和url name:任意起个, 就写fat吧 url:这个是fat jar的地址  输入http://kurucz-grafika.de/fatjar 二.fat-jar的使用 1.第一步,选中项目根节点后,点击右键,在弹出菜单中选择Build Fat

命令行创建一个简单的vue项目过程

//计算机已安装好node和git环境 sudo npm install -g cnpm --registry=https://registry.npm.taobao.org //Mac环境下全局安装cnpm cnpm -v //查看cnmp版本号 ls //查看当前目录 cd //进入根目录 cd git //进入git文件夹 cd VUE //进入VUE文件夹 ls //查看当前目录,显示为VUE文件夹内容 vue init webpack vue-project //在当前目录下创建名为v