JS and CSS files not found after parcel build
See original GitHub issue๐ bug report
parcel build index.html generates the dist folder with all the files, but launching index.html from inside the dist results in can not find css and the js files.
๐ Configuration (.babelrc, package.json, cli command)
.babelrc:-
{
"presets": [
"env",
"react"
]
}
package.json
{
"name": "referraly-frontend",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "parcel index.html"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"material-ui": "^0.20.0",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-router-dom": "^4.2.2",
"typeface-roboto": "0.0.45"
},
"devDependencies": {
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1",
"parcel-bundler": "^1.3.1"
}
}
cli command : parcel build index.html
๐ค Expected Behavior
Produces the build folder with the correct bundles instead of reporting missing css and js files in the browser console.
๐ฏ Current Behavior
Errors in browser console on launching index.html from the build folder dist.

๐ Possible Solution
change src in script and link tags to remove errors.
eg:- change src="/dist/cfb47e75612b85db2daa42a5bbad3b67.js" to
src="./cfb47e75612b85db2daa42a5bbad3b67.js"
But still, only half of the page is displayed

๐ฆ Context
Trying to produce the production build for a test deployment.
๐ Your Environment
| Software | Version(s) |
|---|---|
| Parcel | ^1.3.1 |
| Node | v8.6.0 |
| npm/Yarn | 5.5.1 |
| Operating System | Ubuntu 16.04 |
Issue Analytics
- State:
- Created 6 years ago
- Reactions:3
- Comments:15 (4 by maintainers)
Top Results From Across the Web
parcel did not inject js and css code to the resulted html
I expected the output html to include the code within the js,css files. But the result was that it looks like it only...
Read more >CSS - Parcel
To use CSS modules, create a file with the .module.css extension, and import it from a JavaScript file with a namespace import. Then,...
Read more >CLI - Parcel
The parcel CLI is the most common way to use Parcel. It supports three different commands: serve, watch, and build.
Read more >JavaScript - Parcel
The most traditional file type for web bundlers is JavaScript. Parcel supports both CommonJS and ES6 module syntax for importing files. It also...
Read more >Building a web app with Parcel
Next, you can start adding dependencies to your HTML file, such as a JavaScript or CSS file. For example, you could create a...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found

Sorry i forgot a dot try
parcel build index.html --public-url ./this is also documented on the doc site: https://parceljs.org/production.htmlChange
"start": "parcel index.html"to"start": "parcel index.html --public-url /"