Trouble keeping image path's consistent with WebStorm dev Vx production - webstorm

I love using WebStorm for building html/css/JavaScript apps but one problem I have not been able to figure out is how to deal with paths to images on my src attribute of image tags.
I have (for example) a project path in WebStorm of /documents/myproj/index.html where I've opened the project at /documents/myproj. WebStorm sees the root of the project as /myproj but the URL created when I browse is localhost/myproj/index.html. When I publish the site it becomes localhost/index.html (on my public server).
Image src tags are a problem for me because in development, the WebStorm server wants src=/myproj/1.jpg and in production it wants src=/1.jpg.
Any suggestions for how to keep this straight between running in local mode with WebStorm's built-in simple web server and the published version?

You can edit the host accordingly to make WebStorm serve your files using a different URL. See https://devnet.jetbrains.com/message/5532366#5532366 for some hints

Related

Unable to use gatsby website in offline mode

I've built a gatsby website, but when I try to use it offline (by directly loading index.html into my browser), it fails to load the files in the assets folder, and links to other pages fails
running in windows:
after installing gatsby , I did the following:
gatsby new sample
cd sample
gatsby build
then I went to file explorer and opened the sample/dist directory and double clicked on index.html (Chrome is my default browser, but IE behaves the same)
the result is a half-loaded webpage that is missing the style sheets, javascript, images, and links are broken.
For instance, the "about" link on the first page points to "D:/about" vs. ".\about.html".
Is there anyway to make gatsby work to create a truly off-line website?
I've built a gatsby website, but when I try to use it offline (by directly loading index.html into my browser), it fails to load the files in the assets folder, and links to other pages fails
Gatsby will create a React app for you when it is built, and because most React apps use client-side routing, your links won't work with file:// URLs.
After installing the Gatsby CLI and building your site with gatsby build you should run gatsby serve which will serve up index.html with a static file server on your own machine.
See a similar answer about create-react-app here
Try using gatsby serve from the root of your project. Serve spins up a web server to serve your prod build.
Look it up on the Gatsby CLI docs on their site.
Gatsby isn't really set up to do that, unfortunately. It's a site generator, not page generator, and it expects living on a server. The result is that while the files are static, the navigation isn't.
Because I spent some time experimenting, this is what DOESN'T work:
Setting . as pathPrefix in gatsby-config.js. Gatsby lets you set path prefix, which it then prepends to all generated urls. Unfortunately, this prefix always gets "absolutized" somehow. . gets converted to /., for example.
Setting the absolute path of the file on disk as pathPrefix. Same as above - file:///path/to/file doesn't survive the build (results in file:/) and /path/to/file breaks the JavaScript.
Setting the pathPrefix to a bogus value like /NOTAPREFIX and search-replacing it in the generated files. Breaks the JavaScript, again.
Something I haven't tried but might get you somewhere, would be to disable the Single Page App functionality. It's possible, reportedly, (or maybe with this plugin?) but no good step-by-step instructions anywhere.

How to setup Django + React on hosting?

I've done Django + React application.
I build React code using 'npm run build' and moves that files to hosting together with Python files, I've set up static files in Django app, and now when I'm going to site URL, I see that all static files are loaded. But they don't run. And when on the local environment I saw pretty JS app, now on hosting I see a white screen and when I select compiled JS files in Network tab in Developers Tools (Preview response) I read message "You need to enable JavaScript to run this app." (for CSS too).
I know that this is a noob question. But can you help me to solve this issue?
Thank you.
Check this site out https://www.techiediaries.com/create-react-app-django/
And go down "Integrating React App with Django in production"
This will show you how your app should be structured with the correct settings in your django files.

404 On existing .svc file

I have an IIS site on a Windows 2012 R2 server. The site has an Application inside it:
The URL for this site is setup on our Active Directive servers as it is only accessible internally from our company. The URL follows the following structure:
http://NAMEoftheSERVICE.myCompanyServices.myCompany.local
The service for this site is placed in an internal folder:
http://NAMEoftheSERVICE.myCompanyServices.myCompany.local/InternalFolder/Service.svc
I have placed a number of test files both at the root level and in the internal folder:
http://NAMEoftheSERVICE.myCompanyServices.myCompany.local/HelloWorld.html
http://NAMEoftheSERVICE.myCompanyServices.myCompany.local/InternalFolder/HelloWorld.html
I can browse these files without any problems. However, I cannot browse the service at http://NAMEoftheSERVICE.myCompanyServices.myCompany.local/InternalFolder/Service.svc
The browser returns
However the file is there, and I have made sure there are no typos in the URL I put in the browser.
I have looked at similar questions but there seems not to be anything like the problem I am experiencing. The only question that looked promising was:
WCF service file not visible
But the answer for that post does not apply to my issue as I already have the configuration mentioned in that post setup as it is suggested.
I have checked the IIS-level config files for any exclusion regarding .svc files or anything similar, but could not find anyhting.
Have you got any suggestions on where to look at to solve this issue?
Solution: Install HTTP Activation feature
After running some more testing on other sites on the same server, I actually realised that the issue was specific to .svc files. I therefore made another search on Google and found that the server was missing the "HTTP Activation" feature (part of the WCF Services).
So, if you are having the same issue on .svc files follow the following steps to make sure you have the right components installed on the server:
Open Server Manager
In Server Manager, click the Manage menu, and then click Add Roles
and Features
In the Add Roles and Features wizard, click Next. Select the
installation type and click Next. Select the destination server and
click Next.
Skip the Server Roles page.
On the Select features page, expand ".Net Framework 4.5 Features",
expand "WCF Services" and select "HTTP Activation". Click Next.
On the Confirm installation selections page, click Install.
On the Results page, click Close.
The same can be achieved by running the following Powershell command:
Install-WindowsFeature -Name NET-WCF-HTTP-Activation45
This did the trick for me. I hope it can be of help to someone.

Webstorm How do I set the context root for my application?

I'm having a heck of a time figuring this out (and I assume it is a basic problem and I'm just searching for the wrong terms). I have a plain html site that I'm trying to debug locally and when I open it in a browser or debug it I get this url:
http://localhost:63342/DeleteMe/root/index.html
If I set my resource root to the root folder I end up with:
http://localhost:63342/DeleteMe/index.html
The problem is I use "absolutely" pathed resources such as /js/utility.js because the context shifts based on what AJAX content is pulled in (Hijax-ish application).
What I'd like to see is->
http://localhost:63342/index.html
http://localhost:63342/js/utility.js
for a project like:
[DeleteMe] <--project root
- root
- js
utility.js
- index.html
I'm interested in a solution that deals directly with this problem inside the IDE. I already have a host of tools for web development and I'm evaluating JetBrains at the moment and these little details are what make the difference for me. I can easily set up IIS or Apache to preview the site, I'm looking for a complete solution in a single IDE.
(For reference the project was developed using Eclipse)
Why don't you use your deployed test version to run the application? When I started using Webstorm I had those problems. Then I figured out that Webstorm can debug your source anywhere your are running it.
So, I have my appache set, with any root I want, and I point the sources (using symlinks) to the real source in the project.
Then, I create a configuration for each of the servers I want to use, like this:
I also use that approach, together with hosts, to have multiple different debug environments (for different users, for instance). This is a stretch of my windows hosts file (in C:\Windows\System32\drivers\etc):
...
127.0.0.1 crewhu-admin
127.0.0.1 crewhu-company
127.0.0.1 crewhu-manager
127.0.0.1 crewhu-employee
...
And the debug process for javascript works like a charm for all environments.
Hope this helps...

Is there a way to bind my flex builder to my django application

I am trying to create simple flex application, which uses django as a back-end part. Have a question:
Usually when I run my application Flex Builder creates a file in a directory on my local PC and then opens a browser and points to it. Everything was fine, but when I decided to link django server to flex applications via xml data providers I started to get security errors. (Related to absence of crossdomain.xml). When I created the file and put it on the server:
<?xml version="1.0"?>
<!-- http://www.foo.com/crossdomain.xml -->
<cross-domain-policy>
<allow-access-from domain="http://127.0.0.1:8000"/>
<allow-access-from domain="127.0.0.1"/>
</cross-domain-policy>
Then tried the application again, I got error in console of my FB Error: Request for resource at http://127.0.0.1:8000/go/active/ by requestor from file:///Users/oleg/Documents/FB3/usersList/bin-debug/usersList.swf is denied due to lack of policy file permissions.
I don't know how to fix the error. But also the question is there a way to configure FB3 to put my swf files to the server directly, so I will not need any crossdomain?
Thanks
Oleg
We struggled with this a lot. The Flex security stuff didn't strike me as well built, but perhaps we just had different approaches in mind than Adobe's developers. The solution that worked for us was to serve both the SWF and the dynamic data from the same host and port.
On our development boxes, we tell Apache to serve the SWF from a directory in the workspace, and the dynamic data from a local copy of the app. When we push to production, SWF and app get pushed simultaneously to the same virtual host.
If that's inconvenient for you, the Apache ProxyPass directive can be used to make Apache front for other servers. I've not used that in production, but it's been very handy for developer setups.
I don't know a way to get FlexBuilder to automatically deploy your changed SWF; you could certainly look into an automation approach (like Maven and Flex-Mojos) to make that happen.
That said, getting rid of that error is usually just a matter of adding a policy file to the server.
The second error is caused because you're trying to fetch http resources from a "file" location. My recommendation is that you change your Flex Builder project so it outputs to a location within the Django web site, rather than to the flex-bin directory. This setting can be changed in the properties dialog of the project. Then, you should be able to have your front-end and back-end share the same protocol and domain.