“Way easier than the hassle with web servers and browser extensions” you might think, but not every project allows to insert something else unneeded to every single page. Insert it right before the closing tag and you’re all set. If your web site is running on another server, you need to specify the IP address of your local computer instead. It’s much simpler to set up, but has the disadvantage that you need to insert a small script into every HTML (or PHP or whatever) page of your project (which the browser plugin handles for you at the first method). If all of that is much too complicated for you, there still remains the second way to use LiveReload which I promised above. What to type in at the Package Control command prompt. Now restart Sublime Text 2 once more and like at the native App you just need to enter the localhost URL from above into your browser, enable the LiveReload plugin by clicking on it and from now on every change of the files of your project are directly reflected in your browser without the need to reload. Then hit Enter, wait a few seconds to load, write “LiveReload”, select the appearing entry, hit “Enter” again and the plugin is installed. The exact installation process can be found here.Īfter you have restarted the editor, hit CMD + Shift + P (CTRL + Shift + P for Windows) to open a Package Control prompt, type in “Install” and “Package Control: Install Package” should immediately be highlighted. First you need to install the essential package manager Package Control, which just requires to enter some code into the console (“View > Show console” at the menubar of Sublime Text 2). Find the process id by sudo lsof -i :35729, then kill it by sudo kill -9 PID ( Ex: sudo kill -9 24845)įor more help contact us, we are one of the best Magento 2 development services providers globally.If you rather want to stay in your accustomed environment of your code editor – in this case Sublime Text 2, which I will use exemplary here -, the implementation is a little different.Don't stop a process with Ctrl+C in the terminal. Close the current terminal and open a new terminal and run grunt watch.Grunt message: Fatal error: Port 35729 is already in use by another process Open your custom.css or less file for example then change something then save, here you'll see in grunt watch some new line appears tells that this file has been changed something like:Īnd look now your browser, the item that you just changed appeared and updated instantly without reloading the page, also without cleaning the cache or deploying the static-content, everything is done automatically.Check if the LiveReload browser extension icon is well activated, in firefox the icon comes green, in Chrome the small dot inside the circle becomes full black.If you create a new less file it won’t be exist in the theme, So you have to create a symlink using grunt commands.$ cp /usr/local/lib/node_modules/livereload/bin/livereload.js. You can get the file path of livereload.js during the installation. Move the livereload.js to your Magento_root It is hardcoded value, remove it while moving the code to the production server. We use port 35729 because the LiveReload only connects to that port. livereload -v (will display the installed version)Īdd the bellow line inside tag in default.xml or default_head_blocks.xml of your current theme.Įxample: app/design/frontend/ /Magento_Theme/layout/default_head_blocks.xml:.Install LiveReload package and check it.Install live reload extension for Chrome/ Firefox.With the liveReload it's over all that, it is just enough to save the update and 'Hoop' magically the content that you have changed instantaneously appear without refreshing the browser and without cleaning the cache, deploying the static-content either but for the cache, you also need Grunt. when you change a CSS file or an image, the browser is updated instantly without reloading the page. As soon as you save a file, it is preprocessed as needed, and the browser is refreshed. LiveReload monitors changes in the file system.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |