iconmoon 在rails项目下的使用

  1. 打开页面 https://icomoon.io/app/#/select
  2. 选择需要使用的图标,或上传自己的图标svg
  3. 生成字体,下载至项目的 vender/icomoon 目录

在原有基础上添加时

  1. 打开页面 https://icomoon.io/app/#/select
  2. 在网站上导入 vender/icomoon/selection.json
  3. 重新选择新需要的图标或导入新的图标
  4. 重新下载放到目录: verder/icomoon
  5. 在项目目录下运行 rake copy_icomoon,会将字体以及css更新到对应的assets目录

文件 lib/tasks/copy_icomoon.rake:

task :copy_icomoon => :environment do

  p 'copy fonts...'
  cmd = "cp #{src_font_dir}/* #{dest_font_dir}"
  p cmd
  system(cmd)

  p 'copy stylesheet...'
  FileUtils.cp src_dir + '/style.css', style_file

  content = File.read(style_file)

  File.open(style_file, 'w') do |f|
    content = replace_font_url(content)
    f.write content
  end
  p 'The end'
end

def src_dir
  Rails.root.to_s + '/vendor/icomoon'
end

def src_font_dir
  src_dir + '/fonts/'
end

def dest_font_dir
   Rails.root.to_s + '/vendor/assets/fonts/'
end

def style_file
  Rails.root.to_s + '/vendor/assets/stylesheets/icomoon.scss'
end

def replace_font_url(content)
  content.gsub /url\('fonts\//, "font_url('"
end

你可能感兴趣的:(iconmoon 在rails项目下的使用)