I changed the title of my index.html page in my Angular app. Since it is not a component is it possible to test it, and if so, how?
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Animations Workshop</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
Related
I am a web developer and using Atom as text editor but I always have to change some autocomplete suggestions.
For example when I type html and pres tab it gives me this
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
This result is not actually what so I manually change it like this
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=11">
<meta name="author" content="Your name">
<meta name="description" content="Brief description">
<link rel="manifest" href="/manifest.json">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<meta name="theme-color" content="#00FFF0">
<link href="style.css" rel="stylesheet">
<title>Title</title>
</head>
<body>
<script src="script.js"></script>
</body>
</html>
So I did a research and everybody solves this kind of similar issues with snippets I am not asking how can I do it with snippet. I already know it. I want to change these codes from editor's current location. Possibly it locates somewhere in ~/AppData/Local/atom but I haven't found it yet. I want to reach that file and change related suggestions from there.
This is not only for html suggestion I also want to remove something from PHP suggestion and add some for JavaScript suggestion.
Any idea how this system works and how to do it ?
Thanks.
I am trying to host my angular app into my OpenLiteSpeed but I am not getting anything.
To create the app for production I use: ng build --prod, automatically it creates all the files I need in the dist folder.
Next, I move all these files to my root folder on the server.
Finally, I check if the webpage is working but it doesn't shows anything just the blank page!
The HTML code for the index is:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>ConFusion</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="styles.c3adc567aae88948c2ab.css"></head>
<body>
<app-root></app-root>
<script src="runtime.acf0dec4155e77772545.js" defer></script><script src="polyfills.35a5ca1855eb057f016a.js" defer></script><script src="main.9a959de356bd26498a0e.js" defer></script></body>
</html>
I am trying to use makerjs with node.js but it doesn't work.
If I use cdn like bellow,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/makerjs#0/target/js/browser.maker.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bezier-js#2/bezier.js"></script>
<script src="https://cdn.jsdelivr.net/npm/opentype.js#0/dist/opentype.js"></script>
</head>
<body>
<script type="module" src="index.js"></script>
</body>
</html>
It works well.
If I look at the documentation, it says
npm install makerjs --save
and put this in javascript
var makerjs = require('makerjs');
So I made my html like bellow after installing makerjs with npm
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<script type="module" src="index.js"></script>
</body>
</html>
But it is not working.
What am I missing?
[link for the css]:https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/style.css
[link for javascript code file]:https://github.com/mdn/learningarea/blob/master/html/introduction-to-html/the-html-head/script.js
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<title>Meta examples</title>
<meta name="author" content="Chris Mills">
<meta name="description" content="This is an example page to demonstrate usage of metadata on web pages.">
<meta property="og:image" content="https://developer.cdn.mozilla.net/static/img/opengraph-logo.dc4e08e2f6af.png">
<meta property="og:description" content="This is an example page to demonstrate usage of metadata on web pages.">
<meta property="og:title" content="Metadata; The HTML <head>, on MDN">
<link rel="Shortcut Icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Meta examples</h1>
<p>Japanese example: ご飯が熱い。</p>
<script src="script.js"></script>
</body>
</html>
When I was trying to run the above HTML code, the output just shows this
Meta examples
japanese example:???
I was trying to learn to become a front-end developer, so I just started with HTML where I got struck in this. Please anyone help me with this.
The above HTML document does not consider the CSS and Javasricpt file even though it is presented in the same directory. I also tried it with different browsers.
Please provide correct path in the src attribute of your link tag and it should work.
Check:
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<title>Meta examples</title>
<meta name="author" content="Chris Mills">
<meta name="description" content="This is an example page to demonstrate usage of metadata on web pages.">
<meta property="og:image" content="https://developer.cdn.mozilla.net/static/img/opengraph-logo.dc4e08e2f6af.png">
<meta property="og:description" content="This is an example page to demonstrate usage of metadata on web pages.">
<meta property="og:title" content="Metadata; The HTML <head>, on MDN">
<link rel="Shortcut Icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/style.css">
</head>
<body>
<h1>Meta examples</h1>
<p>Japanese example: ご飯が熱い。</p>
<script src="https://github.com/mdn/learningarea/blob/master/html/introduction-to-html/the-html-head/script.js"></script>
</body>
</html>
I'm using angular and angular-route. The index.html looks like this:
<!DOCTYPE html>
<html lang="en" ng-app="Showcase">
<head>
<meta charset="UTF-8">
<title>UCSD Showcase</title>
<base href="/showcase/">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-route.min.js"></script>
<script src="routes.js"></script>
<script src="./js/bootstrap.min.js"></script>
<script src="js/initGlobalHelpers.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="#########################################">
<meta name="keywords" content="###############################################">
<meta property="og:url" content="#">
<meta property="og:site_name" content="CSES OSS">
<meta property="og:image" content="############################################################################################">
<meta property="og:description" content="#">
<meta property="og:type" content="website">
<meta name="twitter:site_name" content="CSS OSS">
<meta name="twitter:site" content="################">
<meta name="twitter:card" content="summary">
<meta name="twitter:description" content="#">
<meta name="twitter:image" content="#">
<meta name="image" content="#">
<link rel="stylesheet" media="all" href="./styles/style.css">
</head>
<body>
<ng-view></ng-view>
</body>
</html>
And then for my home page when I'm using
<h1>This is the home page</h1>
<script src="home.html"></script>
I get the a warning
Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/. jquery.min.js:4
and an error
SyntaxError: Unexpected token < angular.js:13550
However when I replace that script that by the content of the script which basically ends up looking like:
<h1>This is the home page</h1>
<script>
console.log('Hi!');
</script>
Then it works.
Why is this happening and how can I fix it?
Use ngInclude instead of html script tag
<div ng-include="'home.html'"></div>
See ngInclude docs here