Why Would React Change Image File Extension On Build - node.js

I am using create react app and have an image tag that was inadvertently capitalized (tony.JPG). I did a build and successfully pushed the app to production on Heroku. However, I realized the capitalization issue and change the extension to its proper lower case (tony.jpg). However, the build file still showed with the capitalized extension. I deleted the build file and did a new build but got the same issue again. I resolved the issue by changing the img tag src but I have a lingering question. Why would react keep capitalizing the image extension even though the image file was changed to lower case and there was a new build?
I am using Node, Express, & Create React App. I've tried changed the file path in explorer directly and in my client > public > images > tony.JPG. It may be related but the build > images folder not only has the capitalized extension but has two other files (one that is tony.JPG~e5463541ef50286886de13e03dea670ef69c85c6 and another file called tony.JPG~HEAD).
Images name in public folder (tony.jpg):
Image in build folder (tony.JPG):

As #Matt-holland mentioned the type of OS matters, OSX is type insensitive if you're using it
If you run git mv tony.JPG tony.jpg it will rename it in git

So the issue was resolved when I did a hard reset on my PC. I am using Windows 10. I believe the issue is a bug as the issue resolved itself (i.e. the file name changed) after I ended up doing a hard reset on the PC. It could be an issue with my machine and/or VS. Hopefully this will help someone else that comes across the same issue.

Related

Application problem after build - ElectronJS

I've build my electronJS application with electron-packager and after the build finished, when I launched it, every data was gone. And I got an error that I've never got before on the dev app. (C.F screenshot)
paths are right because it's working on my dev app with the same configuration.
How can I fix this quickly please.
I've tried to change the directory to full path, change inside of the config.js file.
C.F : https://imgur.com/gallery/VN17hNf
Get all my data and my application work correctly. (get all data, add data, display data)
I've finally found the problem. When you build your app, you need to use relative paths. Like path.join(xxx). The app doesn't understand the ./your_path.
And next problem that I've solved, if you use json file and write data inside of it, you need to have a unpacked app w/ .asar file.

Getting App.nw location on OSX

We're building a node-webkit/NW.js application for OS X and want to create a updater for the application so that it will be kept up-to-date automatically.
Because we deploy the nodeJS, css and html in a App.nw package. It's quite easy to download a new package and just replace the old one and restart the application. After searching somewhat on Google we couldn't find any way of getting the location of the App.nw package on OS X.
We deploy a node-webkit redist on OS X but we use our own CEF client for Windows. On Windows it's quite simple, you just get the NW.exe path and work your way to the App.nw from there. Is there some way of doing that on OS X?
Also it might be good to state that we're working on an older version of node-webkit, version 0.8.6. This is because a lot of native modules don't work on 0.9+ of node-webkit because they need NodeJS 0.10.
While you are running your app your can do:
var path = window.location.pathname;
path = path.substr(0, path.lastIndexOf('/'));
That will give your the full path to the app.nw.
The answer is different depending upon whether you are working in a Terminal (command line) window or from Finder.
In OS X, the nw application is called nwjs. You can look around inside the application bundle by right clicking on the application and selecting the Show Package Contents menu item. Navigate to Contents -> Resources and you will see your App.nw file or directory there.
From the command line, go to the directory containing the nwjs app. It should have the name, nwjs.app. From that directory the file (or directory) that you want is nwjs.app/Contents/Resources/App.nw
When customizing your packaged application it is perfectly ok to rename nwjs.app to your_app_name.app. So the name of the app might be something different from nwjs.app.

Deployed version of NodeJS site not loading on AWS

I am doing my first deployment on AWS (using Elastic Beanstalk), and I am completely new to this.
I built a personal website using NodeJS / Express, and on my local machine it loads just fine. Once I was ready to deploy a v1, I created an AWS account and set up a new EBS application environment for Node. I set up the static files to load from /public, set my node version, and set the launch command as node app.js, but those were the only options I changed.
I zipped up my site (using CNTL + Click -> Compress on a selection of all site files) and uploaded that zip, and after some time, it came up all green. Clicking the link to load my site though, I get a half finished version. Looking at my console, I see that I am getting 4 files as 404, and because of that, 4 failures from RequireJS.
These 4 files are backbone views, and are contained in a folder with 4 other JS files that are all loading just fine (I can open them in the chrome dev tools source tab from the deployed version). I am confused how just these 4 files would go missing.
Is there some way to FTP into where ever my files are contained, to confirm the files are in fact not present? And barring that, what steps are available to figure out what is occurring here? Like I said, it looks and loads just fine locally, and I am at a loss as to where to even start debugging something like this. The AWS docs I have read so far only tell me to do exactly what I have been doing.
Repo for the project is here: https://github.com/RyanMG/trustycode
And the deployment is here: http://trustycode.elasticbeanstalk.com/
The files it is having trouble with are under public/javascript/views/ (CodeView, AboutView, PhotoView, DesignView)
Any ideas / advice?
Is there some way to FTP into where ever my files are contained, to confirm the files are in fact not present?
You can ssh into the EC2 instance of the Elastic Beanstalk app using your pem file.
Check files in /var/app/current
I don't have the reputation to comment, but that is one of those common gotchas I found myself switching to OSX from GNU/LINUX at work. OSX is case insensitive; linux world is case sensitive.

How to add a lot of resource files to a monotouch project?

I have a lot of png images into a directory. I've added it to the project as Content/Copy if newer. I can load them from the app without problems.
But, the project needs a lot of time to compile. If i make a little change in the code, the project recompiles all again. It takes a lot of time.
I've tried to add another project, add the files to the new project, but then i can not access to the files from the app.
Is there any solution?
Of course, when i debug the app into the iPad, the uploading+install takes a lot of time. These files will not change ever, so...Is there any method to copy all the content ONE time?
Thanks
I just have discovered a tricks. It seems that monotouch does not remove directories when you upload and install from the MonoDevelop environtment, so:
Add your folders and all the files and mark them as Content
Build your project for iPhone/iPad and Run it from MonoDevelop
Remove your data foldres from your porject
Clean the solution
Make any changes you need in your code, your data reamins in the device!!!
That changes all!!! Before that, when i need to make a minor change in my code, i needed to wait about 15' for building and uploading. Now it's just 1 minute!!!
Place your images in a separate class library
Mark all your files as embedded resources
Add a logical name to each resource (in your project file)
<EmbeddedResource Include="Images\Folder\Filename.ext">
<LogicalName>LogicalNameForImage</LogicalName>
</EmbeddedResource>
4. Load the resource as
UIImage.FromResource(yourAssembly, "LogicalNameForImage");
Embedded resources are loaded on demand, not when the assembly loads.
In A future version of MonoDevelop (my patch didn't make it in time for the upcoming 4.0 release), this won't be an issue any longer.
What currently happens in MonoDevelop 3.x is that when building a project, it will only copy the images that have changed into the app bundle, however, after building, MonoDevelop invokes a script that is installed along with Xcode called iphone-optimize which scans the entire app directory and uses pngcrush to crush all of the images (it also converts all plist files into binary plists). This is the step that causes such slow build times if you have a lot of images.
Just after the 4.0 branch closed for QAing, I wrote a patch that avoids the need for invoking the iphone-optimize script. Instead, what MonoDevelop will do is it will directly invoke pngcrush on only the images that have changed, passing the proper app directory location as the output argument to pngcrush so that we avoid an additional file-copy.
From my own testing, this makes a massive improvement to build times for projects with a lot of image files.
In the meantime, what you could do, is make a backup of the iphone-optimize script (should be located somewhere under /Applications/Xcode.app) and then modify it to not crush image files. Then, once you've done that, go and pre-crush all of your png files in your project.
(Note: when the MonoDevelop with my patch finally ships, it'll also have an option to disable calling pngcrush for developers who have already pre-crushed their images).

MonoDeveloper + MonoTouch - Image refresh

Using MonoDevelop 2.6.1 and MonoTouch 4.x
When an image is changed in the project which is set as "content", the image is not refreshed when the app is rebuilt. This happens even if the MonoDevelop "Clean" command is used.
The only way to get an image updated is to delete the bin and obj folders and then delete the app on the simulator.
Is there a better way to have new images and files marked as "content" in general updated?
This looks like a bug with the way the app updated the images inside the .app file. Could you submit a bug on http://bugzilla.xamarin.com/ so we can get this is looked into and fixed - if you could provide a simple test case then that would be perfect.
Thanks,
ChrisNTR

Resources