I am following the Build an app with App Toolbox tutorial. In the Step 4 (Deploy), after calling polymer build command, the build/bundled and build/unbundled folder are created, but there are no images folder in them. This causes the tab icon not to show up when I deployed the build.
Here are some screenshots:-
In localhost development, the tab icon shows up:
I deployed the build to firebase (https://polymer-app-toolbox.firebaseapp.com/), there is no app-icon because images folder is not in the build output:
Am I missing something? Anyone else seeing the same problem?
Related
I'm new to web development and found a website prototype, but when I tried to open it by clicking on the index.html in the files, it's completely blank. The only thing I see is on the tab, and it just says "React App".
How do I make the website components actually show? I know there should be something showing because I can see all of the code and pages, but nothing shows?? Is there some other way to open the website?
React is a library that compiles all your javascript then renders it in index.html file. If you open the file directly you won't see anything. If you want to run your project then:
Open the project folder in vscode.
Press CTRL+J if you have windows.
Type npm install - It will install all project dependencies listed
in package.json at the root of your project.
Then run npm start - This will start development server locally
that you can use to develop your project as you go.
Then go to App.js and make changes and see how the server
automatically refreshes.
to learn more, go to Get started with react - FreeCodeCamp
I am about to learn ReactJS.
I want to hide the filesystem structure of my server and only show the project root.
If i go to inspect tools in google-chrome i can see where my project is located on my C: Drive.
Wasnt able to find something about it and Ive got no Idea.
Hopefully, someone can help me.
This is because you are using your computer as a server to serve your site so the inspect tools are able to recognize the origin of the code, assets, and images.
Locally, even using gatsby develop or gatsby build (and gatsby serve) you will always be able to see the root of your project, it happens with all web development files, not only in Gatsby.
In a real scenario, where it's a server (with a domain attached, not your PC) that serves the files you will never see the origin because your site will be placed in the /public or /www of your server. To prepare your project to be deployed, you should run gatsby build command, which will create a /public folder in the root of your project with your code compiled, that folder is the one that needs to be deployed.
This is normal in development environment, for deploy your project try one of these approach in root of you project:
npm build
or
yarn build
This command build an optimized version of your project in build folder, after you can upload content of this folder to your www/plulic folder of your server,
Intro:
Currently, I have two separate projects.
One solution is for .NET core Web API 2.0 and another project is Angular 6 app.
I have a problem deploying this to my hosting provider ( asphostsportal ).
It consists of one root folder httpdocs where when I publish my API I copy contents of publishing folder.
After transferring files via FTP I confirm that my API works by sending a request and getting the response.
Now I need to publish my angular project.
The simplest way to do so is with ng build and I get some folder in dist.
Problem:
If I transfer contents of the folder inside dist to my root folder httpdocs on server It can't find any page but API still works.
If I transfer the whole folder inside httpdocs and set server Host setting to define document root to that folder:
It will find the index.html and show me my landing page.
However then API won't work.
If I leave it as is and change the document root back to httpdocs ( where the API files are ) but push the index.html from httpdocs/website to httpdocs ( in this case I also edit index.html to point to website folder for resources etc ) in the hope it will find it ( server IIS setting )
It doesn't. After that my API starts working again. However, no landing page to be found.
Just FYI I do not have any extra startup.cs lines of code that have anything to do with static files nor did my publish command on API project create wwwroot folder ( like mentioned here)
Edit (Solution):
Okay, so I got it to work.
1) I added 2 lines of code in Configure method of Startup.cs in my API
app.UseDefaultFiles();
app.UseStaticFiles(); // For the wwwroot folder
Where according to MSDN
"With UseDefaultFiles, requests to a folder search for: index.html"
2) I manually added wwwroot folder which for some reason was not generating upon publishing command for my API project.
3) In that folder I copied all contents of my dist/website angular publish files
And now it works, cheers!
For creating my college webpage using polymer, I have downloaded polymer starter kit 1.0.2. I have customized those html files to my desired text and it runs well when I do the below.
gulp serve
opening well is chrome through
http://localhost:3000/
The problem is, it doesn't show up when I drop files into my college server. The reason for creating a website so that it can be viewed under my name like www.college.edu/~rajesh. We have public_html folder wherein if we put html/css/js files and that is it will accessible public from above URL.
when I copied the contents of app folder along with bower_component folder
the site doesn't come up whereas it work fine locally (using localhost). Only the title gets loaded however there is NO html body visible.
I am totally new to polymer. could this be done? if yes am I missing something.
You have to run gulp serve:dist which will build/vulcanize your site. Then you need to copy app/dist folder
Just a further clarification not sure if you ran this command, according to the readme file when you want to deploy your site you need to run
gulp
which will Build and optimize the current project, ready for deployment. This includes linting as well as vulcanization, image, script, stylesheet and HTML optimization and minification.
All the files needed will then be located in the 'dist' folder.
Build and Vulcanize polymer starter kit github README.md
I have successfully run my html project using following command
gradlew html:superDev
And after that I run "gradlew html:dist" command .
This compiled my app to Javascript and place the resulting Javascript, HTML and asset files in the html/build/dist/ folder.
Now my question is how to use this "dist" folder to run my project on server.
I tried to upload this "dist" folder on my server and then runs it's index.html file but only superDev Refresh button appears.
Please tell me what are the steps to follow after creating the dist folder ?
Which files and folder should I upload on server ?
Hi I solved it by taking following steps:-
In eclipse I right click on html project and compile it using GWT compile.
2 then run the html project as web application.
3 After successfully launching of the game I copy all the folders excepts WebInf from the war folder and place them in a new folder then upload it on server.
That's it.
But through Gradle I did not get any success.