AdobeDocs / AdobeDocs/commerce-frontend-core
Request for a topic update on including head scripts / styles
- Dominant language
- JavaScript
- Stars
- 10
- Forks
- 87
- PR merge metrics
- No merged PRs in 30d
Description
### Is there an existing issue for this?
- [X] I have searched the existing issues
### What's missing?
# Topic Link
https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/css-topics/css-themes.html
# Description
Please add an example of how to add css with preload in the head section.
Currently we can add scripts or stylesheets with the classic way of
<css src="Vendor_Module::path_to.css"/>
But there's no clear way to add preloaded css
So how would we be able to do something like this?
<head>
<meta charset="utf-8">
<title>JS and CSS preload example</title>
<link rel="preload" href="style.css" as="style">
<link rel="preload" href="main.js" as="script">
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>bouncing balls</h1>
<canvas></canvas>
<script src="main.js" defer>
# Possible solutions
It should give a clear example of adding a css and a js file using rel="preload"
# Additional information
Contributor guide
Research direction
Start with the linked CSS themes topic and review its existing examples for adding scripts and stylesheets. Document clear CSS and JavaScript preload examples using rel="preload", then verify the rendered documentation and links.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, javascript
- Domain
- documentation, frontend
- Issue type
- Documentation
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 68/100