How can I auto minify .js files to .min.js when saving the .js version in Sublime Text 3? - sublimetext3

So I'm using Sublime Text 3 on OS X
I'm also using Minify
I know I can go into a .js file then Tools...Minify...Minify File and it creates the .min.js version in the same directory for me. This works fine but I'm forgetful. Is it possible (and if so how) to tap into Save in Sublime so that if I save a .js file it runs minify automatically for me?
Is this a case where I need a key binding for command + s that is smart enough to know if I'm saving a .js file and save/minify it if so and just do a standard save if not?

So far I've not found a good way to do this in Sublime Text but I did find CodeKit for OS X. CodeKit runs along side Sublime and not only does it auto minify .js files it also runs it through JSLint to help catch issues. (It does more than that)

Like Jason said, CodeKit is a great tool that runs along side sublime. Does compress LESS, SASS, CoffeeScript, JS, and I believe few more. That path for the compressed file is configurable. Once all files are set up, you leave CodeKit running and every single time you save a file in sublime CodeKit compiles. If you are running a local host I believe that your browser reloads as well.

When using Minify in Sublime Text, you can change the settings in Preferences -> Package settings -> Minify -> Settings - User, and add the line "auto_minify_on_save": true,. If the user settings are still empty, do not forget the curly brackets :
{
"auto_minify_on_save": true
}
This will work whether you save with Ctrl + s or from the menu.

Related

Default folder missing in Sublime Text 3 directory

After installing Sublime Text 3, I try to use a custom keyboard shortcut (F5) defined in:
~/.config/sublime-text-3/Packages/User/Default (Linux).sublime-keymap
The shortcut doesn't work, and I see in the console the following message:
Unable to open /home/gabriel/.config/sublime-text-3/Packages/Default/Preferences.sublime-settings
Not only this file is missing in ST's install directory, the entire ~/.config/sublime-text-3/Packages/Default/ folder is missing. But If I open Preferences/Key Bindings, the default keymap file is opened correctly:
and the path shown for that file is within the ~/.config/sublime-text-3/Packages/Default/ folder, which I know is not there (!)
What is going on here? How can I fix this?
Why the Key Binding is not working is nothing to do with the default file paths, the directory not existing, or the console errors.
Restart Sublime Text and the Key Binding will work. Enable command logging to see that it's working: in the console sublime.log_commands(True).
Sublime text shouldn't be displaying the paths for those Default package files. The ~/.config/sublime-text-3/Packages/Default/ directory doesn't exist because those files are distributed with Sublime Text, you'll find the files in the the Default package where Sublime Text is installed e.g. /path/to/sublime_text_3/Packages/Default.sublime-package. .sublime-package files are essentially zip files. Ignore those paths, and the error messages in the console. Those are Sublime Text issues.
None of these answers are directly solving the problem you nerds.
For the silicon-challenged, what you need to do is this:
go to the path that it's telling you doesn't exist:
/home/gabriel/.config/sublime-text-3/Packages/Default/Preferences.sublime-settings
You are on the right track to deducing the source of the problem - I have the same problem but It wouldn't allow me to change the font for my text editing. Sublime must have an install problem. I'm on ubuntu 16.04 LTS .
Do this:
a. create the folder, name it "Default" - under "Packages"
b. go to your sublime text and go to preferences -> settings
c. copy everything on the LEFT side (it should be showing a full list of defaults, which you can't edit, and a user changeable file on the right)
d. go to the folder you just made (Default) -> inside it create a file with the exact name "Preferences.sublime-settings"
e. paste everything into it
f. restart sublime text
g. You are now a G
you're welcome
I arrived here via a very similar search for why a directory was not being displayed in sublime text. In case anyone else arrives here from the same search, here's why:
directories that are known to house source control information and various binary output files are automatically excluded from the sidebar
Source: https://forum.sublimetext.com/t/missing-files-in-folder-tree/31145/3

Sublime Text 3 seems to block .LESS file from getting compiled by WinLess

Until today, I had been using Sublime Text 2 and WinLess software to compile .LESS files to CSS. The files got compiled automatically when I saved a file.
However since I upgraded to Sublime Text 3, automatic compiling has stopped. To see if its issue with WinLess, I tried editing the .less file in NotePad, and the automated compilation work.
So I am assuming Sublime Text3 seems to be locking file or something.
Anyone faced this or have any ideas to debug?
Try adding the following to your Preferences (Preferences -> Settings-User):
"atomic_save": false
See this question and my answer below for an explanation of what Sublime is doing behind the scenes when atomic_save is true (the default setting). Temp files are created and destroyed, and the original file is deleted and recreated. This could easily mess with a LESS compiler just looking for a simple file modification. Using the "atomic_save": false setting also dramatically decreases save time on some network setups.

Run shell script when saving a file in Sublime Text 3

I'm just curious, is it possible to run shell script automatically when I hit CTRL+S in Sublime Text 3 on Linux.
It may be useful for generating CSS when modifying SASS, for example.
Thank you.
Check out SublimeOnSaveBuild. All you need to do is set up a build system like SASS Build, LESS-build, Nodejs, etc., or your own custom build system, so that it's working without intervention when you press CtrlB. Then, enter the particulars into SublimeOnSaveBuild's config file (which allows you to filter by file extension, so you only trigger it when saving .sass files, for example) and you're all set - the build will trigger each time you save a file with the specified extension.
To set up the config file, first open Preferences → Package Settings → SublimeOnSaveBuild → Settings - Default, and copy the entire contents. Close the file, and paste the contents into Preferences → Package Settings → SublimeOnSaveBuild → Settings - User, customizing anything you wish. Save the file, and things should proceed automagically from there. Setting "build_on_save": 0 will disable the plugin.

Where are the default packages in Sublime Text 3 on Ubuntu?

I'm migrating from Sublime Text 2 to 3. In Sublime Text 2, I changed a lot of the default settings of the editor -- such as the tab bar height, sidebar color, etc. -- by modifying the Default.sublime-theme file in sublime-text-2/Packages/Theme - Default. I was also able to modify the colors of the default color schemes in a similar fashion. I've been trying to figure out how to do this for Sublime Text 3, but can't seem to find these files. ~/.config/sublime-text-3 only seems to contain overrides for user settings, not the default settings.
This link on the Sublime Text forums seems to give the location for Windows and Mac, but not for Ubuntu. I've searched a bit to no avail. Does anyone have suggestions?
Thank you!
To amplify on #skuroda's answer - ST3 contains all of its data that, in ST2, was stored in Packages/PackageName, in PackageName.sublime-package files that are basically just zip files, or "Resources" as they're now known. Using PackageResourceViewer, you can easily edit the individual files contained within the resource, then save it back again. When saved, the proper directory structure under Packages/PackageName will be created, allowing you to edit the file directly next time. The way file precedence works in Sublime, any file that exists in ~/.config/sublime-text-3/Packages/PackageName/ will override any file of the same name stored in PackageName.sublime-package.
However, since you don't want these files to be accidentally overwritten, I would suggest creating ~/config/sublime-text-3/Packages/User/Themes/ and User/Color Schemes directories and storing your customized files there instead. The User/ directory is protected from overwrites during upgrades, etc., and unless you're planning on creating a customized theme or color scheme for redistribution through Package Control, it's best practice to keep your files in there.
EDIT
I just realized you hadn't gotten an answer to your original question - where are the files stored? If you installed the .deb file from sublimetext.com, all the .sublime-package files are in /opt/sublime_text/Packages.
If you want the easiest way to save your customized settings first copy all the default settings and paste into a new file named Preferences.sublime-settings.
Then make your changes and save the file to:
/home/**username**/.config/sublime-text-3/Packages/User
In order to see the .config folder you will have to enable show hidden files.
The instructions are written at the top of the default settings list in case you are wondering where got this from.
In the ST console, try entering sublime.executable_path(). This should get you close to where you need to be. Also, you should copy the content of the file out and move them (under a new name to the packages folder). You probably don't want your modifications to be reverted on subsequent update. An alternative method is to try overriding the files you need to. I haven't done that for theme files, so I'm unsure if everything will work as it should. If you take the override route, I'd recommend using PackageResourceViewer. I wrote it to help with browsing/overriding package files in ST3.
You can use
dpkg -L <package name>
For example
dpkg -L subli<tab>
Just open up sublime text, hit ctrl+` to open sublime text console, then run these command accordingly
sublime.packages_path() to see user installed packages directory
sublime.installed_packages_path() to see zipped packages (with .sublime-package file type) directory
Mostly likely, you'll find the Default package inside zipped packages directory.
You can use PackageResourceViewer to see zipped packages's contents as #MattDMo suggested, but more over, you can actually extract zipped packages into user installed package directory directly using PackageResourceViewer's extract command.

How can I minify html, css, js/jquery and ruby code inside Sublime Text 3?

Running Windows 7. What is the best Sublime Text 3 plugin to do this, and maybe beautify the code as well.
May be useful, this shortcut will erase all line breaks of the selected text
Ctrl + J
Notice this is not really minify, since it doesn't consider the code language.
You may have already found something you like by now, but I just ran across this same need and have tried out two plugins: Minifier and Clientside. Clientside has more features like linting and beautifying but is only compatible up to ST2 (according to its Package Control page), whereas Minifier should be compatible with ST3.
Updated 8. 4. 2015 as many things have changed
I've been looking for such ST3 plugin as well. I've tried Sublime HTML5 Minifier by geekpradd and Minify by Zoltan, both seem as great options. See their pros and cons.
HTML5 Minifier
Only minifies, cannot beautify (so far)
Doesn't restructure your CSS or JavaScript files, only removes white space and comments
Not as effective as Minify, but keeps the code readable after beautification
Works for HTML, CSS and JS without trouble
Can minify the code in the current view without creating new files or saving anything
Easy installation, doesn't require Node.js or anything else
Has a typo in console - HTML Minfier instead of HTML Minifier. But maybe it's on purpose :)
Minify
Minifies and beautifies
Restructure your CSS and JavaScript files, renames JS variables, function names etc.
Super effective, smallest file sizes possible, but the code is changed by the minification process
Works for HTML, CSS and JS without trouble, also should support SVG (haven't tested)
Can't minify the code in the current view without creating new files or saving anything, minification always creates a new .min. or .beatified. file in the same directory
A bit more complicated installation, requires Node.js and some other Node.js CLI apps
Which plugin is better?
There is no straightforward answer for that. Minify is more effective, so as long as all you care about is the smallest file size possible, Minify is your choice. I personally use both of these as in some cases, HTML5 Minifier may be a better choice in some cases.
I'm just hoping that Zoltan, the Minify developer, will add the crucial functionality to minify the current buffer without creating or saving any file just like geekpradd did.
I know it is an old question, but here is my answer anyway:
I recommend you to visit the excellent Package Control website and perform a search for the keyword "minify"
You will get a list of various packages for the Sublime Text editor which provide the requested functionality (minifying / beautifying).
Disclosure: I am the author of one of the packages listed on the Package Control website: Minify.
I am not saying that my package is best for everyone, but Minify is the package I use, obviously.
Note: I'm also on Windows 7. My Minify package works in both Sublime Text 2 and Sublime Text 3. Once installed, it works offline, so you can even minify your files while you are not connected to the Internet.

Resources