I'm working on an application with a builtin jetty web-server and velocity templates.
While the application is running and I change some HTML statements inside Eclipse IDE, save the file and refresh the HTML page in my browser - I instantly see my changes.
However, with IntelliJ this is not possible. I always have to recompile my whole application to see my changes in the browser.
I've tried the LiveEdit plugin with a JS debug session and the JetBrains Chrome browser extension. Though the LiveEdit plugin is connected to the IDE I get always an "CONNECTION REFUSED" error. I've also tried some troubleshooting (changing IDE port etc.) - with the same error as result. I think there are some issues with the unrendered velocity templates here.
So my question is: Is there a way to have the same easy behavior while working with CSS and HTML files in IntelliJ like in Eclipse IDE?
Okay, finally got what I wanted. If anybody stumbles over the same issue, here's my solution:
In IntelliJ you have to Make the project or module over the IntelliJ build process to see your HTML and CSS changes in the browser.
To do it a little bit more comfortable you could record a macro in IntelliJ and bind the action to save a project combined with the make process to one shortcut.
Related
Been running into some issues with PhpStorm (v2020.3 on MacOS Big Sur 11.1) lately.
If I make changes to a file and save them, it doesn't trigger actions like a file transfer or recompiling (S)CSS when running npm run watch.
As soon as I focus another application (e.g. the browser for previewing) it detects the changed file and runs the needed action. This causes an annoying delay in my workflow.
At first I thought it had to do with Docker not updating the files in the container, however I now figured out it also does not work with a simple automated (s)FTP file upload/deplyoment.
Anyone else experiencing the same issue?
Cheers,
Allard
Fixed it by remapping the Save document shortcut under Preferences > Keymap. No idea how the shortcut got messed up, but hey, it works.
I've been searching for-ever!
I`m working on windows and ubuntu, mostly on windows.
I searched the web for lot's of external libraries such as opn, open etc' but none of these could open this URL:
chrome://extensions
I want to put in the the script tag inside package.json
or in my build.js script
so that every time after I run "npm run build"
the chrome://extensions page will reload and also the additional page I`m testing on.
I once was able to do that exactly, but I lost that solution.
part of the problem is that I can't open chrome:
the ':' symbol is not recognized in the OS as valid protocol or something and it is escaped from chrome address bar if executed from command line.
I have tried many solutions.
I am not happy with the different resolutions proposed in the research I've made in Stack.O.
reloader as an extension is out of the question I want a script.
your kind help.
Assaf.
Clerc - for Chrome Live Extension Reloading Client
I built Clerc for exactly this purpose. npm run build won't be enough though. You need to hook up a LiveReload compatible server to watch for file changes, and clerc will listen for the reload messages.
Edit: Oh sorry. I missed the part where you said "reloader is out of the question". I still think this is your best option though.
I have site hosted on OpenShift with two pages. The main page works fine- loads right up. The second page, however, comes up totally blank. All of the sources are missing when I use Chrome's Inspect Element tool. The html file is blank and the additional subdirectories (js, css, etc) are just gone.
I'm not getting any errors in the log beyond a "js-bson: Failed to load c++ bson extension, using pure JS version" that I can't figure out but doesn't appear relevant.
The page worked fine for a while but started occurring today when I tried to change the content.
Why would this happen?
It sounds like you haven't committed the latest version of your files to your OpenShift git repository. You need to make sure to perform a git commit before doing a git push
If that isn't the problem, use the rhc ssh command detailed here to log into your application gear and see what files exist there. That may give you some clue as to what the problem is.
I have been learning web development for some time and I have noticed on tutorials on youtube that when someone change source file (html, css, js) the webpage opened in browser is automatically refreshing. I have read something about live-reload but it's too complicated for me and there is no step by step tutorial.
I have found some similar questions, but the case is that refreshing happens by side of local server not the code editor or browser as is mentioned in questions that I found.
I'm using Apache as my local server. Sublime Text for writing a code and Ubuntu operating system.
Here is the video that shows what I am exactly trying to say.
https://www.youtube.com/watch?v=q78u9lBXvj0
Npm and live-server doesn't work on my computer at all.
Sorry for my english, but I'm not a native speaker. I'm looking forward for your help.
Anyone knows anything?
Install sublime web server using package manager ( or in your case continue to use Apache )
Use http://livejs.com/
I build and run my typescript application by Grunt and connect(grunt-contrib-connect) and livereload plugins. While grunt compile .ts files, it also generate sourcemap. My application is oppening on google chrome. How can I remotely connect by Intellij Idea to this application that was run by Grunt and oppened in Chrome for perform debug?
This post is my last hope, that it is possible. Thanks
create a new javascript debug run configuration
in URL field, specify the URL of your client app (http://localhost:9001/index.html or whatever it looks like)
if your local project structure doesn't exactly match the app structure on server (for example, static files are served from <project_root>/public folder), specify remote URL mappings (see http://confluence.jetbrains.com/display/WI/Starting+a+JavaScript+debug+session#StartingaJavaScriptdebugsession-Startingadebugsessionwhenusingadifferentwebserver)
that should be enough... Start grunt, and, when the server is up and running, debug the configuration above
Thank you. I found solution.
First of all, I need Jet Brains extension for Chrome.
I need to make configure debug mode "JavaScript debug" and specify URL that grunt will run and open application.
Run Grunt task that build and open application in browser.
Run debug mode that just reload same page under debugger already.
Don't forget enjoy it.
Since I use typescript, ability to debug in IDE was very important.