滑動旋轉木馬試圖改變文件路徑變量

我使用Slick Carousel與Zurb基金會和推薦使用它有自己的文件夾在根目錄中的CSS，JS和當我設置我的項目，像這樣我可以得到它完美地工作。滑動旋轉木馬試圖改變文件路徑變量

但我想將其添加到我的當前項目的文件結構，像這樣：

項目根
- 字體
  - slick.eot
  - slick.svg
  - slick.ttf
  - slick.woff
  張
- 圖片
  - Loading.gif
- JS
  - slick.min.js
- SCSS
  - slick.scss
- 樣式
  - slick.css

我以爲所有我需要做的是改變在SCSS文件中給出的默認變量：

$slick-font-path: "./fonts/" !default; 
$slick-loader-path: "./" !default;

但沒有我嘗試工作，編譯的CSS有這樣的網址：

background: #fff url('/images/ajax-loader.gif') center center no-repeat;

個

來源

2014-09-19 GCrane93

你的config.rb是什麼樣的？ – cimmanon 2014-09-19 23:33:57

我使用的是zurb基礎配置，如下所示：'＃需要任何額外的指南針插件。 add_import_path 「bower_components /基礎/ SCSS」部署時＃將其設置爲你的項目的根： http_path = 「/」 css_dir = 「樣式」 sass_dir = 「SCSS」 images_dir = 「圖片」 javascripts_dir = 「js」' – GCrane93 2014-09-20 17:21:30

可能的重複[如何使SASS在其輸出中放置相對路徑]（http://stackoverflow.com/questions/12508630/how-to-make-sass-put-relative-paths-in-its - 輸出） – cimmanon 2014-09-20 22:58:20

兩個變量$slick-font-path和$slick-loader-path僅作爲備用而使用對於丟失image-url和font-url功能，這通常是由指南針（參照：http://compass-style.org/reference/compass/helpers/urls/#image-url）。

你必須做的唯一的事情，就是定義由grunt-contrib-compass（https://github.com/gruntjs/grunt-contrib-compass）提供在Gruntfile圖像和字體的默認目錄

下面是我的項目的Gruntfile片段。請查看dist部分中的imagesDir和fontsDir行。其餘的可能在你的項目中看起來不同。

compass: { 
    options: { 
    debugInfo: false, 
    imagesDir: ['src/assets/img'], 
    raw: [ 
     'http_path = "/"', 
     'Sass::Script::Number.precision = 8', 
     'sass_options = {', 
     ' :read_cache => true,', 
     '}' 
    ].join("\n"), 
    require: ['sass-globbing'], 
    importPath: ['bower_components/foundation/scss', 'bower_components/slick.js/slick'], 
    sassDir: ['src/assets/scss'] 
    }, 
    dist: { 
    options: { 
     cssDir: ['dist/assets/css'], 
     imagesDir: ['dist/assets/img'], 
     fontsDir: ['dist/assets/fonts'], 
     environment: 'development', 
     force: true, 
     javascriptsDir: 'build/js', 
     noLineComments: false, 
     outputStyle: 'expanded', 
     raw: [ 
     'sass_options = {', 
     ' :sourcemap => true', // this set to 'true' has no effect, if you aren't using sass >= 3.3 
     '}' 
     ].join("\n"), 
     sourcemap: true // this set to 'true' has no effect, if you aren't using sass >= 3.3 
    } 
    } 
}

希望這有助於。

來源

2015-05-20 23:16:47 IOIO

滑動旋轉木馬試圖改變文件路徑變量

回答

相關問題