app css changes are ignored when building project - blazor-webassembly

I'm currently learning Blazor Webassembly. I had issues with my styling and I could not figure it out, why my CSS is wrong all the time. Then randomly after some time passed I saw, that my changes on Client/wwwroot/css/app.css are not picked up. In the browser it is still the same as when I created the project.
What do I need to do?

This Problem can be solved by refreshing the browser with CTRL+F5

Related

changes on browser moved locally but no changes

I have a website built in Reactjs and SCSS.
I'm doing some `SCSS changes on the browser, however when I move those changes to Visual Studio,
what is supposed to be is when I refresh the browser the changes should appear. however, the changes lost to note that some changes were done successfully to other parts.
I have done search since a couple of days ago and this is what I found
that I should disable caches also delete them plus cookies. I did that. I have also tried to open it in incognito mode
but the problem still appears
link for the sample of the website
here
so i got this error in console log
index.js:1 Warning: Failed prop type: Invalid prop `color` of value `gray3` supplied to `ForwardRef(Typography)`, expected one of ["initial","inherit","primary","secondary","textPrimary","textSecondary","error"]
what I am missing?
Try to refresh the browser by hitting CTRL + F5. This way, the cache will be cleaned, and the CSS changes will be applied
I found out that i was editing the wrong file
since the project is not built by me
thank you everyone who tried to help me

My Angular 10 App deployed in Azure is loosing its styles when refreshed

I have started working on an Angular 10 application using DevExtreme UI Widgets. I deployed a demo version in our Azure Cloud but while I was playing with it, I noticed a strange behavior. It seems that I lose my styles when I refresh.
For example, this is how the login page should be displayed:
If I refresh the URL without entering my login credentials, the page changes and gets displayed like this:
When I login, the bad or good styles are carried over. For example, the landing page should be displayed like this:
If I refresh the screen here, I also see the styles being altered. This is how the landing page gets displayed when the styling is lost:
When I lose the styling if I keep refreshing the page over and over again, eventually I regain the styles and my application starts being displayed as intended.
Any idea what causes the styles to be lost? Any suggestion would be greatly appreciated.
Thanks,
Ed
Regarding the deployment of Angular projects, I have encountered various problems. I am willing to share it with you and hope it will help you.
Troubleshooting steps:
Solution 1.
You can deploy it via Azure Pipelines CI/CD without using the vscode to deploy webapp.
Maybe smth wrong with VS Code plugin, as it is in preview
Solution 2.
Use github for continuous deployment. It is recommended to create a webapp and choose the Linux operating system.
Solution 3.
It is recommended to use FTP to publish the build folder after the project npm build.
This issue was resolved. After further investigation, it turns out that the problem had nothing to do with Azure Cloud deployment. I use DevExtreme UI widgets in my application and the application is based on their Angular Template.
I tried the website using Chrome, Edge and Firefox. The issue described above only happened in Chrome. DevExpress tech support pointed me to this support ticket.
After following the recommendations in the workaround and a redeployment, my app looks fine even in Chrome.
Thanks for everyone trying to help.
Ed

Codekit fails to refresh the browser after second edit?

I'm currently viewing Codekit's preview link of my page in the browser. After saving changes to my CSS, Codekit will auto-refresh the browser and render the changes as expected - the first time only.
After saving another change to the CSS, Codekit fails to refresh the browser the second time. I suspect this has to do with the structure of my files in conjunction with my external server (MAMP).
Currently I've specified my the following as External Server Address http://localhost/
And have set the following as my Preview Subpath: /sw/?v=/car/create
Could it be, that only files in the document root auto-refresh every time changes are made but not those in the Preview Subpath?
Thanks in advance for any help!
I have weird CodeKit2 behavior too: any project autorefreshes fine when I put it to the ~/Desktop/myproject but fails to reload when I put it to the ~/Dropbox/oluckyman-air/Projects/Work/myproject folder.
Seems that length of the project path is affects the autoreload feature.
I had workaround this problem by moving my project to the ~/Projects/myproject folder.
Update:
As Bryan Jones says it’s actually a bug in OS X. See here for a list of ways to work around it: http://feedback.livereload.com/knowledgebase/articles/86239-os-x-fsevents-bug-may-prevent-monitoring-of-certai

How can I properly refresh a Durandal SPA web app when new views are added?

I'm just starting to play with Durandal, using the starter kit. I've added a very simple new view/viewmodel combination (essentially a copy/paste of an existing one from the sample) and mapNav()'d the route.
The problem is happening when I try to refresh my browser...the new view simply does not appear. It's not in the nav bar, nor can I navigate directly to the view by typing in the address bar. I know the code is (or should be?!) correct because if I go to the page in a different browser, everything appears as it should.
Is there some browser caching that Durandal is doing somehow? Sometimes F5 or Ctrl+F5 works to refresh, sometimes it doesn't. I also can't deep-link to a specific 'page'. Ie:
http://localhost:52625/#/newpage just gives me a blank
What am I missing?
The option that I use in Chrome is to open developer tools and right-click on the refresh button. There is an option for 'Empty Cache and Hard Reload' which always fixes this issue for me. I don't know the equivalent in IE but try this and see if it fixes your issue.
Most browsers will cache modules returned via RequireJS, which is how Durandal obtains its modules and view models.
CTRL+F5 doesn't help because that just refreshes the initial page - all the modules are still requested using javascript (RequireJS), so they are usually pulled from cache first.
I've found it's best to disable caching in your browser's developer tools. Doing so will ensure that all network requests are loaded directly from the source and not from cache.
See this question for additional information: Debugging when using require.js cache
Another solution is configure RequireJS to set its urlArgs property: https://stackoverflow.com/a/8479953/91189
This solution works ok, but makes it harder to debug, at least in Chrome, because breakpoints are lost every time the module is loaded, since it's technically a different file being requested each time.

Can't edit or delete CSS file. (ASP.NET MVC)

I'm new to the whole ASP.NET MVC business, and I'm having the weirdest problem. I've been working on a project (MVC3, Razor engine) for the past few days, and yesterday I backed up my project by duplicating its folder. I opened the duplicated project and started working, but I noticed something weird. none of the changes I was making in a CSS file appeared anywhere. I tried changing all sorts of things in it, deleting its content and even deleting the whole file! nothing works. no change. After deleting the whole CSS file from my project, I tried making some changes in the .cshtml file and it does change when I debug the project.
What can be the cause of this?
Your browser probably cached the CSS file. Ctrl+F5 should do the trick in most browsers, to reload the css too and make changes visible.
Sounds as a caching issue to me.
http://www.refreshyourcache.com/en/cache/
Are the files read only in the copy?

Resources