Webloader
Updates css/less on a page live as you type, or when saving js/html/php.
Details
Installs
- Total 744
- Win 486
- Mac 173
- Linux 85
Oct 11 | Oct 10 | Oct 9 | Oct 8 | Oct 7 | Oct 6 | Oct 5 | Oct 4 | Oct 3 | Oct 2 | Oct 1 | Sep 30 | Sep 29 | Sep 28 | Sep 27 | Sep 26 | Sep 25 | Sep 24 | Sep 23 | Sep 22 | Sep 21 | Sep 20 | Sep 19 | Sep 18 | Sep 17 | Sep 16 | Sep 15 | Sep 14 | Sep 13 | Sep 12 | Sep 11 | Sep 10 | Sep 9 | Sep 8 | Sep 7 | Sep 6 | Sep 5 | Sep 4 | Sep 3 | Sep 2 | Sep 1 | Aug 31 | Aug 30 | Aug 29 | Aug 28 | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Windows | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 |
Mac | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 |
Linux | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 |
Readme
- Source
- raw.githubusercontent.com
Webloader - a Sublime Text 2 plugin
Updates css/less live as you type, or reloads the page when saving js/html/php.
Uses websockets, works without a webserver, with multiple pages or files at once. You can run javascript on a page directly from Sublime, define custom actions when you edit/save/load, or add more file extensions. Nothing else to install but the plugin.
Still very much in development, but suggestions and fixes are welcome.
How to use:
- install with Package Control:
ctrl-shift-p
,Package Control: Install Package
,Webloader
- restart Sublime, and go to the plugin's directory:
- windows:
userfolder\AppData\Roaming\Sublime Text 2\Packages\Webloader
- os x:
~/Library/Application Support/Sublime Text 2/Webloader
- linux:
~/.config/sublime-text-2/Webloader
- windows:
- if you have a local webserver, copy the
demo
directory under your webroot (if you don't, skip this) - open
demo/index.html
in a browser (if no webserver, open it asfile://
) - edit
demo.css
with Sublime, and see the changes on the page as you type - edit
index.html
, add some text, save it - this should refresh the page - if you used a webserver, try editing
demo.less
, it should update live too!
Used in your projects:
- in one line: install the plugin, and include webloader.js on your page (if you use .less files, add less.js too)
- webloader.js works standalone, no js framework necessary (less.js is optional; tested with less-1.3.3)
- non-localhost websites:
- if the page is not on your machine, or sees you as a different ip than localhost/127.0.0.1/::1
- define your ip:
<script src='webloader.js?server=192.168.0.100:9000'></script>
- and you may have to enable this port in your firewall
- check out the settings in the
Packages/Webloader/Webloader.sublime-settings
file:- server: if you want to change the above port
- clients: if you do not trust your lan, or opened the above port to the wide internet
- save_parsed_less: if you want to enable converting
.less
to.css
on save - watch_events: if you want to add or remove file types
- sites: if you use virthosts, symlink directories to your docroot, or similar
- you can refresh the browser from Sublime with
F5
(usectrl-shift-j
to select between multiple pages) - you can run javascript on a page directly from Sublime with
ctrl-shift-j
- you can send commands to the server with
ctrl-shift-c
(currently only supports stop/restart/start) - if you feel like hacking around, you can add custom actions to
webloader.js
(or evenwebloader.py
):- the
setup_commands
andsetup_callbacks
show the default actions, feel free to customize these - you can mess around with the code however you like for your own purposes, but you can't distribute it
- the
Future plans:
- more polished codebase, as I'm still changing it around daily
- simpler and easier customization and actions
- I may release under a less restrictive license later, when I feel it's ready
Contact and terms:
- Contact: http://rozsahegyi.info
- Project: https://github.com/rozsahegyi/sublime-webloader
- License: Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License.
- Summary: free to download/share/use, but you have to credit me, and you can't sell, alter, or bundle this.
Credits:
- plugin code on the sublime API and standard python library
- uses less.js for compiling .less files