scss:compass、gruntjs 和 Bower 安装基础 - 导入路径

2023-12-23

所以我有 yeoman 创建的以下目录结构。

calvin % tree -L 2
.
├── Gruntfile.js
├── app
│   ├── 404.html
│   ├── bower_components
|   |      └── foundation
│   ├── favicon.ico
│   ├── index.html
│   ├── robots.txt
│   ├── scripts
│   ├── styles
|   |      ├── main.css
|   |      └── main.scss     
│   └── views
├── bower.json
├── karma-e2e.conf.js
├── karma.conf.js
├── node_modules
│   ├── connect-livereload
│   ├── grunt
│   ├── grunt-concurrent
│   ├── grunt-contrib-clean
│   ├── grunt-contrib-coffee
│   ├── grunt-contrib-compass
│   ├── grunt-contrib-concat
│   ├── grunt-contrib-connect
│   ├── grunt-contrib-copy
│   ├── grunt-contrib-cssmin
│   ├── grunt-contrib-htmlmin
│   ├── grunt-contrib-imagemin
│   ├── grunt-contrib-jshint
│   ├── grunt-contrib-uglify
│   ├── grunt-contrib-watch
│   ├── grunt-google-cdn
│   ├── grunt-karma
│   ├── grunt-ngmin
│   ├── grunt-open
│   ├── grunt-rev
│   ├── grunt-usemin
│   └── matchdep
├── package.json
└── test
    ├── runner.html
    └── spec

在我的样式目录中,我有一个main.scss由指南针监视的文件,如 Gruntjs 中配置的那样。

在我安装了基础之后,通过bower install foundation我的基础文件被下载到bower_components目录中,如何导入我的基础类main.scss ?

这似乎不起作用

@import "foundation";

我假设你正在使用grunt-contrib-罗盘 https://github.com/gruntjs/grunt-contrib-compass并将指南针作为一项艰巨的任务运行。

对于 Foundation 5,以下内容不起作用

  • require 'foundation'(或“zurb 基金会”)
  • 使用importPath指定位置的选项

解决方法是我在网上偶然发现的迁移页面 http://foundation.zurb.com/docs/upgrading.html, 这是通过指定外部配置文件config: config.rb。在该配置文件中,指定导入路径:

add_import_path "bower_components/foundation/scss"

然后当你打电话时grunt compass它会编译得很好

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

scss:compass、gruntjs 和 Bower 安装基础 - 导入路径 的相关文章

随机推荐