Mindscape Web Workbench generates duplicate CSS files when compiling with Sass - visual-studio

I have set up Mindscape Web Workbench with my Visual Studio 2010 project so that the compiled SCSS files are outputted to a separate folder. My intended structure is something like this:
Styles/
|
|– output/
| |– toMain.css
| |– toMain.css.map
|
| – toMain.scss
But what I'm getting is 2 outputs, like so:
Styles/
|
|– output/
| |– toMain.css
| |– toMain.css.map
|
| – toMain.scss
| |– toMain.css
| |– toMain.css.map
I've double checked the output settings for the toMain.scss file via Mindscape > Web Workbench Settings and the only output I see is indeed that file set for the Styles/output folder, but I'm still getting the duplicate. I don't have any other extension in VS2010 that handle SASS, and I can't seem to find any information about this issue anywhere. Are there any other settings for the extension that could be causing this?
EDIT: It may be worth noting that I'm using Team Foundation Server with this project - so the outputted CSS is excluded from source control. I'm not sure if this makes a difference.

i had that too before.
File with .map extension is use to decode your compressed file, for example you have .js file that you minimize to .min.js, to help decompress your file you can use .map.
So if you said that .map is shown at your generated folder, it means that you're css it compressed.
So you have 2 options :
1. do not compress your css file.
2. find the setting to not generate .map file.
im using prepros theres a setting for that.

Related

Laravel nWidart/laravel-modules, move an existing module to another folder

I have a bunch of modules in Modules folder. For example "Modules/Customers"
And I need to move everything to "Modules/Core/Customers" keeping all the functionality working. Besides I must will use another subfolder for some modules:
Modules
|___ Core
| |__ Customers
| |__ Products
|
|___ External
|__ Taller
I suppose there might be three possibilities:
1- Lucky one: automatically with an artisan command, but I did not find anything on documentation (https://docs.laravelmodules.com/)
2- Manually changing files and configs, but I suppose that will leave namespaces unchanged, and that is not acceptable I would say.
3- Worst but likely: manually changing namespaces and config files.
I went for the third one as #lk77 suggested and everything was correct if I changed the folder for modules in config file module.php, except that then I cannot add several paths (or I don not find the way as it does not seem to be an array) or a more generic Modules/* as path.
'paths' => [
/*
|--------------------------------------------------------------------------
| Modules path
|--------------------------------------------------------------------------
|
| This path used for save the generated module. This path also will be added
| automatically to list of scanned folders.
|
*/
'modules' => base_path('Modules/Core'),
Thanks a lot!!
Thanks very much
Here is what I finally did. For the existing modules created previously in "Modules":
1- Move files to Modules/Core folder and change manually all references to "Modules/" for "Modules/Core" in folders "app", "bootstrap" and "Modules" (with help of replace all from sublime :-) ). Afterwards it was necessary to manually change references in files "composer.json" and "module.json" of each module.
2- In config/modules.php activate scan:
'scan' => [
'enabled' => true,
'paths' => [
base_path('Modules/Core'),
base_path('Modules/External'),
base_path('vendor/*/*'),
],
],
After doing this old modules seemed to be working properly, but trying to include new ones triggered errors.
In fact the versions that included the feature to add the possibility for managing submodules/subfolders were retired shortly after the release.
So, finally I guess it is better not to use this approach with the package due to the problems.
In the end we are going to use subfolders in Laravel default tree for the core modules and use the package laravel-modules for external and optional custom modules:
app
|
|--- Http
| |
| |--- Controllers
| . |
| . |--- Customers
| |--- Products
|
|--- Models
. |
. |--- Customers
. |--- Products
.
.
Modules
|--- Taller
.
.
.

Generate MAKFILE dependency with header and source files in separate directory

I have 3 layer architecture project for embedded
top layer - application
middle layer - middle(HAL Layer)
bottom layer - bottom(Driver layer)
I need to make a Makefile for the project with multiple source and header files which are in different directories.
For sake of understanding of makefile consider this as c project.
The issue I am facing is I am not able to generate the dependency files for the source files.
I have seen many tutorials but mostly in the example code of MAKEFILE, the header files are present in the same folder with the source files.
In my case the files are in the below structure.
project
|
|---- _build(DIR)
| --- Makefile
|
|---- application(DIR)
| inc/main.h
| src/main.c
|
|---- middle(DIR)
| inc/middle.h
| src/middle.c
|
|---- bottom(DIR)
| inc/bottom.h
| src/bottom.c
As the header files are in separate folder, I am not able to generate the dependency files(.d files).
Without including header files like
-I<header_files>
How to generate the dependency files?
http://make.mad-scientist.net/papers/advanced-auto-dependency-generation/
No Header file is included using -I options because source and header files are in same folder
Youtube example but same result, header and source in same folders.
https://www.youtube.com/watch?v=NPdagdEOBnI

How to compile all scss files located in different folders?

I have a file structure as follows:
all_skins
|— 1
|— css
|- _skinVariables.scss
|— file.scss
|— file.css
|— 2
|— css
|- _skinVariables.scss
|— file.scss
|— file.css
|— 3
|— css
|- _skinVariables.scss
|— file.scss
|— file.css
common_css
| _specificCode.scss
| _otherCode.scss
Inside my scss file for each "skin" I'm importing some general scss partials such as _skinsVariables and _specificCode. The _skinVariables partial changes for each skin, and the _specificCode is a general partial reused in all the scss files located outside the all_skins directory.
The problem is that whenever I make a change in the specificCode partial file, I need to recompile manually each scss file to generate the new css with the modified code.
I'm using PhpStorm's file watcher, so any change to the specific scss file triggers the watcher, but a modification to the included _specificCode (or any included partial) doesn't trigger it.
Is there any way to compile all the scss files inside a parent folder? There are over 30 of these numbered sub-folders, so doing it by hand is time consuming.
Any solution using command line, PhpStorm itself, or other software such as grunt will do for me (least desired).
Edit:
The file.scss would be as follows:
#import "skinVariables";
#import "../../../common_css/specificCode"
To be a bit clearer, the problem is that I have the partials included in all my file.scss, to make life easier most of the code comes from the partials.
When I modify a partial that is imported in all the files, such as _specificCode.scss, I would need all the file.scss to be re-compiled, but this doesn't happen.
The way the watchers seem to work at the moment is that they're triggered only when a modification is done to the file.scss itself, not to the partial that is being included.
Any work around this?
So now you have the file watcher set to watch the open files and in case of modification it should compile ONLY the file itself.
What you need is to set your scss transpiler to compile the /all_skins/1/css/file.scss, /all_skins/2/css/file.scss, etc., but I don't know if the ruby transpiler you're using is capable of this setting.
I solved something similar with http://gulpjs.com (Grunt alternative) with Gulpfile.js config like this (altered to your paths):
gulp.task('styles', function() {
return gulp.src([
'all_skins/**/*.scss'
])
.pipe($.sass())
.pipe($.autoprefixer('last 3 version'));
});
Then set a PhpStorm's file watcher to watch whole all_skins and common_css folder (can be set by "scopes") and run gulp task named "styles" and it should work.

Underscore in partial Sass file

Is it necessary to have a .scss partial file start with an underscore? The documentation states that a partial should start with an underscore, because the file would otherwise compile to a CSS file.
However I've noticed gulp-sass compiles files without an underscore into one complete CSS file just fine.
1. Partials must start with an underscore if you do not want them to be generated into a css file.
2. A scss file can import another file without an underscore and still compile correctly.
Take this example:
sass
+-- base
| +-- _normalize.scss
+-- components
| +-- site-header.scss
+-- utilities
| +-- _icons.scss
+-- site.scss
Here we can see that site-header.scss and site.scss do not have underscores. If I ran a gulp task to compile anything within the sass folder, two files would be output.
site-header.css
site.css
We do not want to generate site-header.css but because we have omitted the underscore the compiler only ignores files with an underscore and generates a css file for it.
site-header.scss can still be referenced in site.scss with an #import
#import 'components\site-header';
This will result in the same outcome whether it is prefixed with an underscore or not.

Linked Files within a Folder Structure

In Visual Studio when I linked a file from one project to the next, I get the following error when an attempt is made to load the linked resource. This only happens when the linked file is within a folder(s).
Error:
Message="'pack://application:,,,/projectName ;component/ResourceDictionary .xaml' value cannot be assigned to property 'Source' of object 'System.Windows.SharedResourceDictionary'.
Example:
Project1.Resources
|
|--> MergedResourceDictionary.xaml
|--> ProjectResourceDictionary.xaml
|--> Folder
|
|--> SharedResourceDictionary.xaml
Project2.Resources
|
|--> MergedResourceDictionary.xaml
|--> ProjectResourceDictionary.xaml
|--> Folder
|
|--> SharedResourceDictionary.xaml **LINKED**
If in the MergedResourceDictionary.xaml we merged these dictionaries, then the "SharedResourceDictionary.xaml in Project2 will not be found. However, if the SharedResourceDictionary.xaml is linked at the root of the project then the resource is found at runtime.
**NOTE: In the "obj/debug" of project2, all linked resources are at the root directory, whereas in project1 resources remain within the folder structure assigned in the project.
Steps to recreate
This happens at runtime. Steps are as follows (using files listed in original post).
1) Create SharedResourceDictionary in Project1, within "Folder"
2) Create "Folder" in Project2, then add "as link" SharedResourceDictionary within the folder
3) Build and run app
4) App will not be able to find the SharedResourceDictionary.xaml, due to it residing within the Folder. Removing the file from the folder structure will work fine as a linked file.
I appreciate any assistance,
Chris
I spent sometime working with Microsoft support on this problem. It is a bug with MsBuild and doubtful to be something they fix in the future.
I have found a workaround for anyone that is interested:
Create a PostBuild event that runs LocBaml and creates the folder structure that you require and places the files in the correct folder.
Hope this helps.

Resources