How to integrate dart sass #use with a framework like Bulma? - dart

I'm trying to use Dart Sass' #use to customize Bulma, but as far as I understand it, when I do e.g.
#use "utilities/_all" with (
$blue: #0f52ba,
//etc
);
I can't then use e.g.
#use 'layout/hero';
Because the hero sass file expects a global $colors which would be redefined here as _all.$colors.
I also tried to load the utilities/_all without namespace like this
#use 'utilities/_all' as * whith (
//etc
);
To no avail… When debugging, I indeed see as set respectively _all.$colors and $colors but the hero files always throw this error:
Error: Undefined variable.
╷
14 │ #each $name, $pair in $colors
│ ^^^^^^^
╵
layout/hero.sass 14:25 #use

Related

angular material bug: upgrade to 15, then angular custom theme compile error : SassError: Undefined mixin

angular material 15 looking for #include theme.validate-theme-styles($light-theme, $theme); however, validate-theme-styles is indeed not defined.
I just updated angular and angular material to 15, the custom theme is now throwing build errors. it worked fine with version 14.
./src/lawyer.scss - Error: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined mixin.
╷
54 │ #include theme.validate-theme-styles($light-theme, $theme);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
#material\linear-progress\_linear-progress-theme.scss 54:3 theme-styles()
node_modules\#angular\material\progress-bar\_progress-bar-theme.scss 14:3 -palette-styles()
node_modules\#angular\material\progress-bar\_progress-bar-theme.scss 35:7 #content
node_modules\#angular\material\core\mdc-helpers\_mdc-helpers.scss 193:5 #content
node_modules\#angular\material\core\mdc-helpers\_mdc-helpers.scss 233:3 disable-mdc-fallback-declarations()
node_modules\#angular\material\core\mdc-helpers\_mdc-helpers.scss 192:3 using-mdc-theme()
node_modules\#angular\material\progress-bar\_progress-bar-theme.scss 33:3 color()
node_modules\#angular\material\progress-bar\_progress-bar-theme.scss 60:7 #content
node_modules\#angular\material\core\theming\_theming.scss 402:3 private-check-duplicate-theme-styles()
node_modules\#angular\material\progress-bar\_progress-bar-theme.scss 54:3 theme()
node_modules\#angular\material\core\theming\_all-theme.scss 47:5 #content
node_modules\#angular\material\core\theming\_theming.scss 402:3 private-check-duplicate-theme-styles()
node_modules\#angular\material\core\theming\_all-theme.scss 44:3 all-component-themes()
src\lawyer.scss 27:1 root stylesheet
node_modules\#angular\material\progress-bar\_progress-bar-theme.scss 60:7 #content
node_modules\#angular\material\core\theming\_theming.scss 402:3 private-check-duplicate-theme-styles()
node_modules\#angular\material\progress-bar\_progress-bar-theme.scss 54:3 theme()
node_modules\#angular\material\core\theming\_all-theme.scss 47:5 #content
node_modules\#angular\material\core\theming\_theming.scss 402:3 private-check-duplicate-theme-styles()
node_modules\#angular\material\core\theming\_all-theme.scss 44:3 all-component-themes()
src\lawyer.scss 27:1 root stylesheet
Here is my scss file:
#use '#angular/material' as mat;
#include mat.core();
/*The define-palette Sass function accepts a color palette, described in the Palettes section above,
as well as four optional hue numbers.
These four hues represent, in order: the "default" hue, a "lighter" hue, a "darker" hue, and a "text" hue.*/
$my-primary: mat.define-palette(mat.$indigo-palette, 800);
$my-accent: mat.define-palette(mat.$green-palette, A700);
$my-warn: mat.define-palette(mat.$red-palette,A700);
$my-theme: mat.define-light-theme((
color: (
primary: $my-primary,
accent: $my-accent,
warn: $my-warn,
)
));
//#include mat.core-theme($my-theme);
//#include mat.button-theme($my-theme);
#include mat.all-component-themes($my-theme);
I tested the root cause is because of the last line, if I use core-theme and button-theme, not all-component-themes, it can build fine.

Is there a way in lua to define a function that will run if a file is required?

I would like to create a lua function early in a script that will then automatically get called if a matching filename is required but before that require is complete.
effectively it will go
if FILE then
run before FILE is loaded
end
-- some other stuff
require"FILE"
If FILE is never required then the stuff in the if will never run
require is just a function so you can redefine it.
$ cat foo.lua
real_require = require
function require(mod)
if mod == 'string' then
-- do something
print('importing ' .. mod)
end
return real_require(mod)
end
require'string'
$ lua foo.lua
importing string
$

Neovim lua unable to load config from different file

I am unable to load config when using require. Form below you can see that I added 2 files under the lua directory
lua/bufferline.lua
lua/plugins/bufferline.lua
I am tried loading both via
-- Bufferline
use {
"akinsho/bufferline.nvim",
tag = "v3.*",
requires = 'nvim-tree/nvim-web-devicons',
config = [[require("bufferline")]]
-- config = [[require("plugins/bufferline")]]
} -- buffer list with icons
And both failed to load the config changes. But adding the config inline in the plugins.lua the config shows up when restring.
Please check below for my files
lua directory structure
> tree
├── bufferline.lua
├── colorscheme.lua
├── keymaps.lua
├── options.lua
├── plugins
│   └── bufferline.lua
├── plugins.lua
init.lua
require "options"
require "keymaps"
require "plugins"
require "colorscheme"
plugins.lua
--
-- Automatically install packer
local install_path = fn.stdpath "data" .. "/site/pack/packer/start/packer.nvim"
if fn.empty(fn.glob(install_path)) > 0 then
PACKER_BOOTSTRAP = fn.system {
"git",
"clone",
"--depth",
"1",
"https://github.com/wbthomason/packer.nvim",
install_path,
}
print "Installing packer close and reopen Neovim..."
vim.cmd [[packadd packer.nvim]]
end
-- Autocommand that reloads neovim whenever you save the plugins.lua file
vim.cmd [[
augroup packer_user_config
autocmd!
autocmd BufWritePost plugins.lua source <afile> | PackerSync
augroup end
]]
-- Use a protected call so we don't error out on first use
local status_ok, packer = pcall(require, "packer")
if not status_ok then
return
end
-- Have packer use a popup window
packer.init {
display = {
open_fn = function()
return require("packer.util").float { border = "rounded" }
end,
},
}
-- Install your plugins here
return packer.startup(function(use)
use "wbthomason/packer.nvim" -- Have packer manage itself
use "nvim-lua/popup.nvim" -- An implementation of the Popup API from vim in Neovim
use "nvim-lua/plenary.nvim" -- Useful lua functions used ny lots of plugins
-- Bufferline
use {
"akinsho/bufferline.nvim",
tag = "v3.*",
requires = 'nvim-tree/nvim-web-devicons',
config = [[require("bufferline")]]
-- config = [[require("plugins/bufferline")]]
} -- buffer list with icons
-- require("bufferline").setup{
-- options = {
-- numbers = "buffer_id",
-- always_show_bufferline = true,
-- separator_style = "thin"
-- }
-- }
use "christoomey/vim-tmux-navigator" -- navigate between tmux and nvim
--
-- Automatically set up your configuration after cloning packer.nvim
-- Put this at the end after all plugins
if PACKER_BOOTSTRAP then
require("packer").sync()
end
end)
I think the general problem here is, that you're using the double brackets for the config = option:
config = [[require("bufferline")]]
As far as I know (my lua skills aren't that great) those double brackets ([[) are used to create a raw string in lua, so you're basically giving config a string which, I assume, vim tries to execute it as vimscript-code.
A solution for that is simply stick to lua and convert your config = line to the following:
config = function() require("bufferline") end,
so in total in should look like this:
-- Bufferline
use {
"akinsho/bufferline.nvim",
tag = "v3.*",
requires = 'nvim-tree/nvim-web-devicons',
config = function() require("bufferline") end,
} -- buffer list with icons
Important hint
You may also need to rename your bufferline.lua file because the module-name of the plugin already uses the name bufferline so require("bufferline") will actually get the module but not your bufferline.lua!

Dart Sass failed with this error: Undefined variable. SASS

I don't understand what this compile error is describing because I do define the SASS variable:
Dart Sass failed with this error: Undefined variable.
╷
64 │ color: $sc-blue-light;
│ ^^^^^^^^^^^^^^
╵
_partials/navigation/_search.scss 64:12 #use
style.scss 65:1 root stylesheet
_utilities.scss
$sc-blue-light: #5BC2E7;
_search.scss
.search {
color: $sc-blue-light;
}
_style.scss (the main stylesheet)
#use '_partials/base/_utilities';
#use '_partials/navigation/_search';
The utilities are being loaded first, which is what I've read in other answers but it's not applying here. The file paths are correct.
All my other styles compile okay. It's just when I started using variables that this error comes up.
Any thoughts?
TL;DR
Add #use rule at top of the file in _search.scss too.
With namespace
#use '_partials/base/_utilities';
.search {
color: utilities.$sc-blue-light;
}
or without namespace
#use '_partials/base/_utilities' as *;
.search {
color: $sc-blue-light;
}
Quote from official sass
Members (variables, functions, and mixins) loaded with #use are only
visible in the stylesheet that loads them. Other stylesheets will need
to write their own #use rules if they also want to access them.
and
The simplest #use rule is written #use "", which loads the module
at the given URL. Any styles loaded this way will be included exactly
once in the compiled CSS output, no matter how many times those styles
are loaded.
Read about sass #use members
Read about sass #use namespace

Failed to open - Zend Framework

Warning: require_once(Zend/Application.php) [function.require-once]:
failed to open stream: No such file or directory in
D:\xampp\htdocs\obsessa\public\index.php on line 17
Fatal error: require_once() [function.require]: Failed opening
required 'Zend/Application.php'
(include_path='D:\xampp\htdocs\obsessa\library;.;D:/xampp/php/PEAR;D:/xampp/php/ZendFramework')
in D:\xampp\htdocs\obsessa\public\index.php on line 17
Hi Anyone help me on this ?
D:/xampp/php/PEAR;D:/xampp/php/ZendFramework
Should probably be:
D:/xampp/php/PEAR;D:/xampp/php/ZendFramework/library
The immediate problem is that your php include_path configuration is wrong. The reason is the way PSR-0 autoloading works. Your include path has two paths. If you want to load Zend\Application, then you need an include path that has a subdirectory called 'Zend'. In your case, D:/xampp/php/ZendFramework does not have that, you need D:/xampp/php/ZendFramework/library (which has a subdirectory named Zend, which has a file named Application.php)
But really, if you're doing ZF2, grab the skeleton application and use composer, just like the docs say, especially if you're new. composer is fantastic, and it's the preferred way to go. With composer, each application you write has its own installation of zf2. There are very few situations where you want your apps to rely on some globally-installed framework, which is the setup you're trying to do.
Please follow this step :
Please donwload the zend libray from zend official site
http://framework.zend.com/
Then paste donwloaded library in zend libray folder
Index.php file settings
//Ensure library/ is on include_path
set_include_path(
implode(PATH_SEPARATOR,
array(realpath(APPLICATION_PATH . '/../library'),
get_include_path(),)));
/** Zend_Application */
require_once 'Zend/Application.php';
please set index.php file as:
// Define path to application directory
defined('APPLICATION_PATH')
|| define('APPLICATION_PATH', realpath(dirname(FILE) . '/../application'));
defined('LIBRARY_PATH')
|| define('LIBRARY_PATH', realpath(dirname(FILE) . '/../library'));
// Define application environment
defined('APPLICATION_ENV')
|| define('APPLICATION_ENV', (getenv('APPLICATION_ENV') ? getenv('APPLICATION_ENV') : 'production'));
define('PUBLIC_PATH','http://'.$_SERVER['HTTP_HOST'].'/demo/public');
// Ensure library/ is on include_path
set_include_path(implode(PATH_SEPARATOR, array(
realpath(APPLICATION_PATH . '/../library'),
get_include_path(),
)));
set_include_path(implode(PATH_SEPARATOR, array(
realpath(DOCTRINE_PATH),
get_include_path(),
)));
/** Zend_Application */
require_once 'Zend/Application.php';
// Create application, bootstrap, and run
$application = new Zend_Application(
APPLICATION_ENV,
APPLICATION_PATH . '/configs/application.ini'
);
$application->bootstrap()
->run();

Resources