I have run meteor in my applications 100 times, and my apps always render to localhost:3000. right now, though, on one specific app, my browser is blank. Ive hosted it locally before and I can host other applications. additionally, there are no console/terminal errors.
When I view page source, it's blank, but when I inspect elements, it's my code...
I pulled down a version of the project that I know worked on localhost, and I get the exact same thing.
What could be happening?
Try this, It worked for me:
cd to-your-app-dir
meteor npm install
meteor
Ensure that you have a route set for localhost:3000/.
See flow-router or iron-router.
Also double check what your app does during the onCreated() event of your template at localhost:3000/.
Related
I'm working on a website on nextjs but the Link component and the router is kinda driving me crazy. When I click on a link it has an horrible delay before accessing the page and then if you use the browser back button the page don't change, just the url.
Here is the link of my site, don't really know what is happening actually.
https://next-madeleine.tmsssss.vercel.app/
It is common for Next.js and other frameworks as well to be slow in development time. As I can see and confirm in your production live website, the links work well, even great. That it because in development there are certain tools and packages being used by Next.js and webpack to compile on-fly the code. Those tools are disabled and removed in a production build of course, and the pages are cached by Next.js.
So, try to run npm run dev and compare it with npm run build, followed by npm run start
NextJS runs getInitialProps, getServerSideProps and getStaticProps every time you link to a page, which might be time consuming. You can skip this by shallow routing your page. Link accepts a boolean prop called shallow={true}.
<Link href='/your-page' shallow>Your Page</Link>
With Next's router.push:
router.push('your-page', undefined, { shallow: true })
Read more about Shallow Routing - https://nextjs.org/docs/routing/shallow-routing
I've been messing around with a tutorial site, and I found that my VS Code LiveServer plugin doesn't work properly when I try to open Django templates. The CSS I applied is missing (although everything renders correctly in my local development sever), and the template language code is actually printed to the screen rather than executed (see image below). My liveserver plugin appears to be working with html files outside of Django.
(1) Right now I'm right clicking and selecting "Open with Liveserver." Is this wrong for Django? The liveserver docs recommend trying to "visit the Actual Server Address: http://localhost/[workspace], not the VS Code extension's Live Server Address: http://127.0.0.1:5500/". I tried including the file path in place of [workspace], but no luck. What do I do here?
(2) I saw in another thread where someone recommended their own solution, here. I'm not sure where I'm supposed to run the './manage.py livereload' command, but it's not working in command prompt. What is the difference between './manage.py' and 'py manage.py'? And will this solution be any better than the VS Code plugin?
I have had the same problem as you and managed to get it working with the link you included in point (2) of your post. You may have gotten sorted by now, but I thought I'd post it here in case.
First I went to my console and ran:
pip install livereload
which was installed successfully. Then I added 'livereload' to my installed apps in my settings.py file. E.g...
INSTALLED_APPS = [
...
'livereload',
...
]
Then I went to the directory containing my manage.py file on the terminal and ran
./manage.py livereload
and this provided me with a link to a live update server. Previously I had been running a server with "python manage.py runserver", so this is to replace that command.
Now when I save any changes I make in my IDE, they update live on the browser.
Sorry that I haven't included any screenshot images for clarity, I wasn't able to for some reason.
I am working through Scrimba/VSchool tutorial, so I am wondering if you may have run into this problem through a similar path.
I believe Live Server and Django are incompatible - but if you find a fix, let me know.
Live server is acting as your web server (port 5500 by default), serving up files as your make changes.
Django is also acting as a web server (port 8000 by default), interpreting Python code, and rendering the Django Template Language.
Unfortunately, as far as I can tell, live server cannot execute all this Python code, so all the Django Template Language will not render. This includes the {% load static %} method that Django uses to read the CSS & JS links in the html.
For those of you who tried the top answer, but still got stuck: you have to install dj-static, or whitenoise (as recommended by the dj-static github page) to serve the static files. I noticed that it's really slow though. Maybe it's just me, but I found it to be quite unworkable. I ended up writing an autohotkey script to activate my browser and then refresh. At least for me, that´s a lot quicker.
in your command line you have to run the server by the following command:
python manage.py runserver
but be sure that you are in the directory that has manage.py file. you don't need to type the port. because you will get the default port which is:8000
I know the VS Code is the tool most seen in Angular demos and I've tried them but I was going through a YouTube demo on using Visual Studio to develop a Hello World Angular app.I started out using NPM START to run the app then was following the instructions here to use the Visual Studio Start button to initiate the app.
The app was sometimes rerunning and sometimes not. I was thinking it had something to do with the startup folder but now I wish that I would have modified by startup page instead.
Here's what my folder structure looks like:
Anyways, I first I started messing with the application root URL. I tried changing it from
http://localhost:61539
to
http://localhost:61539/src
and some other values too. I confirmed that i wanted to create a virtual folder and played around entering multiple values. As a result, I noticed that my IISExpress icon in the tray started to show all of the URLS that I had entered
I wanted to try an undo these virtual folders that I created but I didn't know where they were stored. Finally, I saw that the last path that I specify is stored in the VS Project file but I don't know where all of the other sites are stored. I'd like to delete them. Is there some IIS Express config file?
The whole problem started when I was trying to get the initial the web page to come up and I was getting a "Forbidden" error. Now I think that it could possible be solve by setting my initial page to src/index.html, although the YouTube video didn't mention it.
Now, every time I hit the start button to run the web app, the following URL is displayed with an extra trailing slash after the html page name.
http://localhost:61539/src/index.html/
and I still get the forbidden error.
Question
So, how do I clean up my IIS Sites that I don't need and set my startup params so that the web page comes up and displays index.html?
I have a nice html, css template (source code here).
I am going to use this template in my angular2 app (source code here).
I got the html template out of this repository (index.html).
My problem is in the angular2 source code
You need to clone the angular source.
Run npm install
Run ng serve
Unfortunatly, it seems that the <script src="assets/js/main.js"></script> in index.html is not added properly. Although, there is no error in the console, the left menu is broken. I know that this problem occurs when main.js is not fit.
Here is the correct html page:
Here is the angular page (broken header and menu):
The codes are identical, but I have decomposed the html template into 3 components (header, menu, and app (main content)).
Instead of trying to figure out what happened with your CSS, I took the original template, converted it to Angular 2 with the angular-cli, and fixed the CSS issues. It all works now, and the complete source is at https://github.com/Boyan-Kostadinov/angular2-miminium
When you broke apart index.html it's likely that you also altered some file paths.
The relative path would go from src="assets/js/main.js" to something like src="../assets/js/main.js".
Prepending ../ to the path will back out of the current directory to the next level up. As you have it now, the browser is looking for the assets directory in what I assume you have compartmentalized as an htmlComponents directory.
Consider using the absolute path to main.js, at least to diagnose the issue.
I ran into a similar issue with the same file. In my case, I have a complicated application that is developed in stages. I installed my Angular seed in a subdirectory. Because of my file structure, when I run npm start, the live server that is started has bad relative link locations. For example, in the screen shot below, you will see that the application is trying to find style.css at http://localhost:3000/medface/RecordWriter/styles.css; however, it should be looking at http://localhost:3000/styles.css, because the root of the web server that was created by npm start is at /medface/RecordWriter/.
With respect to your project. The key to finding the problem with your link is to open the developer panel and inspect the actual network request. If you share a screen shot, we may be able to help you inspect your instance with more insight.
What Worked for Me
In my case, I reconfigured my local web server to handle any unserved pages in the Angular2 folder and return the index instead. When I run npm start, I close the browser page that opens and use my regular web server. Instead of viewing my application on localhost:3000, I view my application at localhost/medface/RecordWriter/ (which is equivalent to localhost:80/medface/RecordWriter).
The down side to my makeshift approach is that the page must be refreshed before changes appear, but it loads all resources predictably and reliably, and allows my Angular2 code to run in conjunction with some of the older code base in other areas of the website that have not been converted to Angular2. Regardless, this may work for you also.
I think I have installed everything needed and installed it correctly, but I am obviously missing something; or had a misstep somwhere along the line. I am on a Linux and I know for a fact the site works when viewed elsewhere. Here is a screenshot of what I see when I view the site locally: http://imgur.com/yPWcanu What are the common causes for this?
There might be some problems with paths. Open the Chrome development toolbar and check if there's a problem with loading the css files.
You should see them under the "Network" tab after reloading the page.