Sass::Importers to load from an alternative fallback folder - sass

I'm trying to use a frontend project as a git submodule so i can use it as fallback import path if there is no file in the current project.
On the config.rb of the assets/sass/ folder, one simple line is required:
add_import_path "../../frontend/assets/sass/"
This way, if no file exists on the assets/sass/ folder structure it will try to find it on frontend/assets/sass/ folder.
This works but every #import tries to load relatively to the file where the #import is. I'm thinking on developing a Sass Importer that first tries to load the same file from an "A" folder structure and if it doesn't exists tries to load from "B" folder structure.
So, if there is a "assets/sass/common/base/_!base.scss" with an
#import "fonts/fonts";
First it will try to load it from:
assets/sass/common/base/fonts/_fonts.scss
And if it doesn't exist it will try to loads from:
frontend/assets/sass/common/base/fonts/_fonts.scss
So the question is:
Is possible to accomplish that with a Sass importer?
Looking for documentation (http://sass-lang.com/documentation/Sass/Importers/Base.html) or examples i didn't found something like this but i think it is not a strange case. I'm not used writing Ruby code so i must confirm if it can be done before i try to write some code.

Related

Sass throwing "Error: Can't find stylesheet to import"

Folder structure:
Error description:
Sass version:
ParcelJS solved my problem by being able to compile my Sass/Scss code into plain CSS but i don't want to use it in such a small project like this one.
OS: MX Linux.
Sass is able to compile my code just fine if i don't use #use or #import.
Try importing like below with a relative path:
#use ./abstracts/resets
Here is an overview of how Sass imports files:
Finding the File
It wouldn’t be any fun to write out absolute URLs for every stylesheet you import, so Sass’s algorithm for finding a file to import makes it a little easier. For starters, you don’t have to explicitly write out the extension of the file you want to import; #import "variables" will automatically load variables.scss, variables.sass, or variables.css.
⚠️ Heads up
To ensure that stylesheets work on every operating system, Sass imports files by URL, not by file path. This means you need to use forward slashes, not backslashes, even when you’re on Windows.
Load Paths
All Sass implementations allow users to provide load paths: paths on the filesystem that Sass will look in when resolving imports. For example, if you pass node_modules/susy/sass as a load path, you can use #import "susy" to load node_modules/susy/sass/susy.scss.
Imports will always be resolved relative to the current file first, though. Load paths will only be used if no relative file exists that matches the import. This ensures that you can’t accidentally mess up your relative imports when you add a new library.
💡 Fun fact:
Unlike some other languages, Sass doesn’t require that you use ./ for relative imports. Relative imports are always available.

Include docx file in asciidoc?

I am using asciidoc with asciidoctor to create documentation for a current project.
I notice there is a markup to include files in the documentation like so:
link:index.html
or
link:protocol.json[Open the JSON file]
Is it possible to include a docx file as a link so that it would open externally or be able to downloaded?
Also can I put this file in a folder inside my asciidoc directory (for the sake of organization) and still be able to properly reference it?
You write something like this:
Open this link:somefile.docx[Word file] should work.
Or this link:file:///C:/Users/xxx/docs/otherfile.docx[second file].
It works with relative path or absolute path.
You need to ensure that the path to your file will be correct for the reader of your document.
Example: if you put the HTML files produced by Asciidoctor on a webserver (public or intranet), having a path referencing your local C: is not a good idea.
It is hard to tell you what to do without knowledge of your publication/distribution toolchain.

Watch a folder, use a specific entry point, then output a single css file

I have a folder of SCSS files. The main SCSS file is /css/app.scss. It imports all the other SCSS files, like /css/variables.scss and /css/component_a.scss.
How can I have sass watch my /css/ folder for any changes, then recompile starting from /css/app.scss?
Right now it errors since /css/component_a.scss uses variables defined in a different file. But in app.scss they are imported in the correct order.
My answer may be limited because I don't have all the information about how you are compiling sass and what settings you are using.
However I can see that your file names aren't prefixed with an underscore, basically sass will compile every file individually that doesn't have the '_' prefix.
Basically what you want to do is set up your task manager (grunt, gulp, etc) to watch all files ending with '.scss' then tell it to run the sass compile task and have this pointed at your app.scss file.
With the limited information I have from your question I hope that my answer points you in the right direction to solve your problem.

Adding ZXingObjC framework to a project

Now that ZXingObjC can be used as a framework I can't figure out for the life of me how to add it to my project. I followed the instructions on the git page https://github.com/TheLevelUp/ZXingObjC, but when I add #import <ZXingObjC/ZXingObjC.h> xcode can't find the file. The example projects that they provide, however, compile fine.
Current answer would be http://cocoapods.org.
Put
pod 'ZXingObjC' into your podfile.
The file below does not exist in library header files.
#import <ZXingObjC/ZXingObjC.h>
Also set library header file path in Search Header Path in Build Settings. and import file as per your requirement.

Can't use Stylus #import with Rake Pipeline

I have a simple Rake Pipeline setup that does nothing more than run "stylus" on my .styl files, using the rake-pipeline-web-filters gem. (The original pipeline does much more, but I've trimmed it down to the essentials for this question.
=== Assetfile ===
require "rake-pipeline-web-filters"
output "build"
input "app/style" do
# Compile Stylus to CSS
match "*.styl" do
stylus
end
end
This works fine for converting individual .styl files to individual .css files.
However, I am not able to use the Stylus #import command to import one file in another (necessary for mixins, among other things. Instead I get the error
ExecJS::ProgramError: Error: stylus:1
> 1| #import "appmixins"
2|
failed to locate #import file appmixins.styl
All the styl files are in the same folder, and when I execute stylus on the commandline using the npm version, the import works fine, so there's no syntax error.
Is this just something that's missing from the Stylus Filter in rake-pipeline-web-filters, or is there something I can do to make it work?
Ok, it looks like when I run the in Rake Pipeline in assumes all paths are starting from the directory I'm running the pipeline in, and so all the #imports have to be relative to that. Changing my imports to #import "app/style/appmixins" worked. This is different from what the NPM version of Stylus does, since it expects (and the docs specify) that all the paths are relative to the individual stylesheets. Not sure if I could have specified the block differently in the Assetfile to make this work as expected, but no matter, it all works for me now.

Resources