Live server does not show updates from SCSS in WebStorm - sass

I have a problem with a live server. When I write SCSS, the live server does not show changes from time to time. If I delete some line of code and paste, it will show changes sometimes.
I have checked #import, all is connected. I also checked _ for SASS files. Just updated WebStorm to the latest version (using it for Front End).
What might be the issue?

Related

PhpStorm/JetBrains: How to Automatically Upload a Gulp Sass generated CSS file

I'm wrecking my brain trying to figure out how to word this so it's understood.
I'm basically using PhpStorm. I have a gulpfile that generates a minified CSS file from a src/sass dir, which gets renamed and placed into the public/css folder.
What I would like to do is automatically upload this minified css file to the server using PhpStorm's deployment tools.
I'm able to get all of the .php files to upload (obviously) and the Sass is able to auto-upload (I disabled this), but I can't figure out how to automatically upload the CSS file that's generated. It's annoying having this fluid setup and then having to manually upload the css file each time I do a few edits.
Any ideas? No pun intended, lol.
Files created or modified by gulp/grunt/etc are considered external changes as they are not created in IDE itself but by some process that runs completely independently (e.g. gulp -watch) or was launched from IDE.
Therefore you need to enable similarly named/appropriate option in Deployment option so that IDE can upload them as well. That option is called Upload external changes -- https://www.jetbrains.com/help/phpstorm/options.html
Once IDE detects changes (e.g. when focus gets back to IDE or by running File | Synchronize) the file should be uploaded using current deployment entry in a same fashion as other (modified in IDE) files.

Fail to restore CSS file in PhpStorm

While I was working in PhpStorm on a website computer restarted and an error appears. I using Windows 10. After restart CSS file was empty and I lost my work. The CSS file appears like it still have 9kb, but in PhpStorm it is empty.
I've tried to restore from PhpStorm, but the Local History is empty too.
Can I restore it? If I can, how can I do it?
Did you save the file prior to the crash? If not, take a look at PHPstorm's autosave functionality.
Also, and I don't mean to be condescending here: frequently saving your stuff and proper backups are important.

Trigger typescript compile-on-save from chrome devtools

I'm debugging and editing my .ts files on the fly using Chrome devtools (when debugging).
One of the major drawbacks doing so is that in order to reflect changes of .ts files in associated .js files, I must switch back to Visual Studio, click on "yes, reload" and trigger another save of each modified file (in order to rebuild js), and only then i can come back to my page and F5 it.
Is there a way to tell VS (or chrome, btw) to automatically compile TS files when they're saved ?
edit i'm using chrome workspaces to sync files with disk
Is there a way to tell VS (or chrome, btw) to automatically compile TS files when they're saved ?
If you use chrome workspaces, it will load the ts files from disk instead of in memory. That way when you save a file it is saved to disk. This means you can wire up something like https://github.com/TypeStrong/grunt-ts to compile on save to get the new JS which then can be live reloaded

Typescript 0.8.3.1 Compile-On-Save degraded and stopped working today

Visual Studio 2012, Typescript 0.8.3.1 Yesterday, I started having problem where, when I saved 1 .ts file, it would show me errors (about 6 in 3 files because they relied on the change I had just done), when I saved one of the other files that I went to fix the error it would none of the errors (even if I didn't fix).
When I rebooted, for the first 3 or 4 minutes, it showed no errors, but then 'suddenly' doing a save by adding and removing a space, the errors showed up, but then when I made a 'real' change, the js file did not change.
I can make any change I want and the js only changes if I exit VS and come back in, and when it reloads (I've tried this a few times) the js file is sometimes several changes out of date from the ts file, sometimes is based on the newest ts file.
I uninstalled the ts plugin and web essentials this morning and reinstalled (still 0.8.3.1).
No differences that I can see to the symptoms.
I have verified that both Visual Studio settings in Tools > Options > Text Editor > TypeScript > Project > Compile on Save settings are Unchecked and that the Webessentials one IS checked to compile on save.
There are no 'new' files and the only changes I've made in the past few days other than those noted above are to edit my existing ts files. Yesterday it appeared to be working fine until these anomalies started to occur.
The issue you are describing sounds like either...
A genuine bug in your code that isn't getting shown immediately
A problem with the state of the incremental editor
If it is the latter, there are improvements coming in newer versions. If you need help checking for code problems you'll need to share the code or a cut down example that demos the problem.

Files not uploading via Aptana 3

I'm new to Aptana 3. I recently switched from using an FTP (Filezilla) and text editor just to speed the file editing process up a bit.
I'm dealing mainly with Wordpress sites on a shared Godaddy hosting account, and am having some trouble uploading the files I have edited via Aptana to my live site.
i.e. I've edited several lines in my "main.css" file. I save it in my "Project Explorer" window in Aptana, have my FTP connection all set up and working, and click the "Upload" icon. I refresh my browser and nothing has changed, and I can see the website is still pulling in the old css. I've also tried "synchronizing" my files and hitting the "Publish" button, but that doesn't work either?
I've also tried just editing the file in a new Remote Connection tab, but no joy either.
I've hunted all over for simple walkthrough for deployment or file sync guides for Aptana, and watched a few video tutorials but nothing has worked so far.
Hold Control+F5 for a few seconds in your browser. You probably are just running a cached version of the CSS in your browser. That should prune it.
I had the same problem. What I found I had to do was an initial synchronization, I know you mention that you did this but it may be that it didn't fully sync as its not always clear what is going on with the Aptana sync.
What I did:
Make sure your Project has a connection in it and that it points to the server location that you want to sync with
Select the Remote tab and right-click on a file within the chosen connection, choose File Transfer...
This will open the sync window and it will initiate a compare, this is where confusion set in for me, if the folder structure is not identical it will propose to create and delete lots of files. I found I was deselecting items to be safe but meant that it did not correctly sync. Make sure you are syncing from the same root level and then let it do a full sync, this seems to register or record a link between the local and remote files.
Run the sync. when it is complete you will now be able to upload individual files successfully from the Project tab using the upload icon (before a successful sync this will not work - even though it looks like it is doing an upload).
Hope this helps.

Resources