问题
I'm developing a webpage and I use Bootswatch for styling. Sometimes I have to work offline, and host locally. Unfortunately Bootswatch can't be used offline since it uses a version of Bootstrap css with an extra font at the begining:
@import url("https://fonts.googleapis.com/css?family=Lato:300,400,700");
This means build fails every time, and I can't deploy. I've seen the question: Bootstrap CSS without Google Fonts But it doesn't have a satisfactory answer. They suggest just deleting that line, but I still need it when deploying, and because of version updates it would get overwritten very fast anyway at the next update. I'm looking for a solution which either:
- ignores the import, when offline
- overwrites the import, when offline (ex. import manually the font, and then change the import for a local one), I'd very much like this version
And all this as a final solution, I don't want to change the code after every npm/bower update...
回答1:
The latest Bootswatch versions (> 3.3.6.1) introduce a SASS variable $web-font-path that you can override and set to an empty value:
// use google fonts api offline
$web-font-path: '';
@import "fonts.yeti.offline";
@import "yeti/variables";
@import "yeti/bootswatch";
To serve the required fonts offline, I used https://google-webfonts-helper.herokuapp.com to generate the fonts.yeti.offline.scss file and to download the required font files. To switch between online and offline mode, you can toggle the first two lines in your code.
来源：https://stackoverflow.com/questions/34772357/bootstrap-css-without-google-fonts-2-bootswatch