Error Less2CSS plugin while compiling less file in Sublime Text 2 - less

I installed Sublime Text 2 and Node.js.After that i install less with that command npm install -g less with command console.When i install Less2CSS plugin and try to compile less file then i am getting error The compress option has been deprecated. We recommend you use a dedicated css minifier, for instance see less-plugin-clean-css.I found the same issue on here also.But i didn't understand what and which file to change.please help me if anyone have same issue.I attached the screen shot for more understand the issue.Thank you everyone.

To fix this issue, go to Sublime Text and:
Go to Preferences > Browse Packages
Open the Less2css folder
Open the lesscompiler.py file in a text editor
Go to line 184 and change this
cmd = [lessc_command, less, css, "-x", "--verbose"]
to this
cmd = [lessc_command, less, css, "--clean-css", "--verbose"]
Save the file, restart Sublime Text, and attempt to save your LESS file again.

It means that the option is not supported. it recommend you use a dedicated css minifier.
You can change the option.
Via "Preferences" -> "Package Settings" -> "Less2Css" -> "Settings - Default".
change ["minify": true,] to ["minify": false,]
and then, if you want to minify the css file, please use a dedicated css minifier to do this.

Related

.ejs files in Sublime default to file type "Plain Text"

I'm new to coding and I'm using the Express framework in Sublime.
When I create .ejs files, (for example footer.ejs) for some reason Sublime shows these files as Plain Text files, instead of .ejs files, even though I have NPM installed ejs.
Furthermore, when I click on "Plain text" in the bottom right of Sublime, EJS doesn't show up as an option.
My package.json shows that I have ejs installed: "ejs": "^2.5.9".
Does anyone know what I'm doing wrong? And how I can get .ejs files to automatically default to EJS instead of plain text? Thanks!
The short version of the answer to your question is that installing a package via npm doesn't have any effect on Sublime. In order to add support for EJS to Sublime you need to install a package for it in Sublime.
Package Control has a couple of packages, EJS and EJS 2 (and maybe also Hyperloop EJS, if that's a thing; I'm unfamiliar with EJS).
Just at first blush it seems like EJS 2 might be the better first bet; it's been more recently updated and is using the newer sublime-syntax syntax format and seems to support more things. Take that with a grain of salt though, since I have no experience with either one.
You can select the command Package Control: Install Package from the command palette and then select one of those packages to install it. If you're going to try them both, do it one at a time and use Package Control: Remove Package before installing the next one so that they don't compete with each other.
If those commands aren't in your command palette, you don't have Package Control installed yet. In that case you can select Install Package Control from the command palette to install PC first. If that doesn't work there are also instructions on how to install it manually.
Once you have a package installed, you can close and reopen the file to apply the correct syntax, or use the menu as you mention in your question.
Let's make it short and simple.
Syntax highlighting and auto completions are not great if you were to download ejs package.
Instead I recommend you to use html syntax highlighting.
Open Command pallet using ctrl+ shift + P or cmd + shift + P.
Set Syntax: HTML

VSCode Typescript.NPM Warning for Babylon.js TS File

I use VSCode as an IDE for Babylon.js. To show Babylon.js code hinting, I was recommended to use "babylon.d.ts" file as the value of the "typescript.npm" in the VSCode's User Settings.
But when I hovered over a property in my JS script, a warning came up:
Could not install typings files for JavaScript language features.
Please ensure that NPM is installed or configure 'typescript.npm'
in your user settings.
How to fix this error and show the code hinting for Babylon.js JS script on VSCode?
to get babylon.js typings, just drop the babylon.d.ts file in your folder.
The file will be used by VSCode compiler directly

How to automatically synchronize/refresh SCSS/CSS file on change?

Recently my client switched from Eclipse to Intellij. In both IDEs I was editing SCSS files externally and running "compass watch" in terminal. This worked great in Eclipse. immediately after compiling SCSS file I was able to simply refresh browser and see the changes.
In Intellij it takes up to 30 seconds to see the changes, or if I enable "synchronize files on frame activation" I have to switch to browser first, then back to Intellij, and then back again to browser in order to force refresh. Third option is to manually sync "css" folder, which is not convenient. I had a same issue when I was editing and compiling SCSS files in Intellij.
How can I force Intellij to detect CSS file change faster?
I've found the solution.
Open "Settings / File Watchers" and go to SCSS. Make sure that field "Output paths to refresh" has the same value for the output as "Arguments" field.
For example, this is my setup:
Arguments:
--no-cache --update $FileName$:$FileParentDir$\css\$FileNameWithoutExtension$.css
Output paths to refresh:
$FileParentDir$\css\$FileNameWithoutExtension$.css

Sublime Text Indentation Settings Being Overwritten By a File

I am working on a project where tab size is supposed to be 4 and tabs should not be spaces. I updated my Preferences.sublime-settings file to include
"detect_indentation": "false",
"tab_size": 4,
"translate_tabs_to_spaces": false,
When I open a new file these settings are set to how I want and everything works. However, if I open an existing file (scss or html) that has indentations as 2 spaces, my Sublime settings are overwritten and indentations change to 2 spaces. If I click View > Indentation I see that Tab Size is set to 2 and Indent Using Spaces is enabled, even though my preferences should be the opposite of that.
If I manually change Indentation via View > Indentation to Tab Width: 4 and deselect Indent Using Spaces, this works until I save the file, at which point the settings revert to Tab Width 2 and Indent Using Spaces turned on.
How can I force Sublime Text to honor my indentation preferences and not be overwritten by another file. I would assume that Sublime is detecting the indentations on the page, but I've turned that setting off.
Here is my preferences file showing that things should be working:
Here are the messed up settings for a scss file. All I did was open it:
I don't think any plugin is causing this, I disabled most of them and was still experiencing this issue. However, for reference, here is a list of all packages I have installed:
Alignment
BracketHighlighter
Capybara Snippets
ColorPicker
Dotfiles Syntax Highlighting
EditorConfig
Emmet
ERB Snippets
Gem Browser
Gist
Git
GitGutter
Haml
jQuery
JSHint
Package Control
Pretty JSON
PyV8
RSpec
SCSS
SideBarEnahancements
SublimeLinter
Terminal
TrailingSpaces
Thanks in advance for any help.
So I figured this out by completely uninstalling Sublime Text and all associated packages and settings, then reinstalling the app and one-by-one reinstalling my packages. It turns out that one of my packages, EditorConfig, was overwriting my Sublime Text style settings.
EditorConfig is actually a really cool plugin that allows a number of developers working on one project across multiple IDEs to have a consistent style by defining indentation type, size, charset, and other settings.
The answer to my problem was that in the particular project directory I was working some of the node modules I had downloaded had .editorconfig files that had indentation set as size 2 and spaces instead of tabs. I had to either uninstall the EditorConfig package from my Sublime Text or create a new .editorConfig file in the root directory of my project. This is the .editorConfig file I created that fixed my problem.
# top-most EditorConfig file
root = true
# 4 Tab Indentation
indent_style = tab
indent_size = 4
When a file is loaded, its contents are examined, and the "tab_size" and "translate_tabs_to_spaces" settings are set for that file. The status area will report when this happens. While this generally works well, you may want to disable it. You can do that with the "detect_indentation" setting.
This might be helpful: https://www.sublimetext.com/docs/2/indentation.html

yuicompressor and/or uglify-js does not work in PhpStorm

I have installed node package manager (npm) on my windows machine and then i ran the command "npm install less -g" and went on setting up the file watcher in PhpStorm for LESS. This worked very good. I also managed to get it to put the .css files in the css folder instead of in the less folder where I have my .less files.
My next step was to install yuicompressor so I ran the command "npm install yuicompressor -g". And then I set it up in PhpStorm by adding the yuicompressor for CSS, but it only creates empty .min.css files.
In the PhpStorm watcher settings I have set:
Program: "C:\Users\XXX\AppData\Roaming\npm\yuicompressor.cmd"
And ticked the box "Create output file from stdout"
I want to achieve this:
.less (project_root/less) -> .css (project_root/css) -> .min.css (project_root/css)
Is there any one else that has had the same problem, I can't seem to find any solution.
Btw, I also tried to install uglify-js, but with the same result, it only creates empy .min.js files.
Some extra info, my environment variables are as follows:
PATH (User) = C:\Users\XXX\AppData\Roaming\npm
Path (System) = C:\Program Files\nodejs\
I removed the "Create output file from stdout" (from the yui CSS file watcher and left it checked on the LESS file watcher) and it seemed to work. But I had to link to the yuicompressor.cmd and not the .jar file as mentioned in the links from LazyOne. I also had to uncheck the "Immediate file synchronization" on the LESS file watcher but needed it to be checked on the yui CSS file watcher.
Seems like its very tricky to get it to go from "LESS -> CSS -> CSS compressed" with only saving the .less file when editing, but with this setup it finally worked.