Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Syntax Error in manifest.json
See original GitHub issueHello There!
I am new to web packs/encore but I seem to be stuck on an issue, I’m trying to load an image asset but the console of my chrome is showing this error: “Uncaught SyntaxError: Unexpected token :” on manifest.json:2
I think this error is preventing me from being able to call the path from the asset() method
My manifest.json:
{
"build/app.js": "/build/app.js",
"build/fonts/glyphicons-halflings-regular.eot": "/build/fonts/glyphicons-halflings-regular.f4769f9b.eot",
"build/fonts/glyphicons-halflings-regular.ttf": "/build/fonts/glyphicons-halflings-regular.e18bbf61.ttf",
"build/fonts/glyphicons-halflings-regular.woff": "/build/fonts/glyphicons-halflings-regular.fa277232.woff",
"build/fonts/glyphicons-halflings-regular.woff2": "/build/fonts/glyphicons-halflings-regular.448c34a5.woff2",
"build/images/glyphicons-halflings-regular.svg": "/build/images/glyphicons-halflings-regular.89889688.svg",
"build/images/school_logo.png": "/build/images/school_logo.c3f8883e.png",
"build/manifest.js": "/build/manifest.js",
"build/theme.css": "/build/theme.css",
"build/vendor.css": "/build/vendor.css",
"build/vendor.js": "/build/vendor.js"
}
My webpack.config.js
// webpack.config.js
var Encore = require('@symfony/webpack-encore');
Encore
// directory where all compiled assets will be stored
.setOutputPath('web/build/')
// what's the public path to this directory (relative to your project's document root dir)
.setPublicPath('/build')
// empty the outputPath dir before each build
.cleanupOutputBeforeBuild()
//create shared resources
.createSharedEntry('vendor', [
'jquery',
'bootstrap-sass', //load boostrap/js
'bootstrap-sass/assets/stylesheets/_bootstrap.scss'//load bootstrap/css,
])
// will output as web/build/app.js
.addEntry('app', './app/Resources/assets/js/main.js')
// will output as web/build/theme.css
.addStyleEntry('theme', './app/Resources/assets/style/theme.scss')
// allow sass/scss files to be processed
.enableSassLoader()
// allow legacy applications to use $/jQuery as a global variable
.autoProvidejQuery()
.enableSourceMaps(!Encore.isProduction())
//for manifest.json
.addLoader({ test: /\.json$/, loader: "json" })
// create hashed filenames (e.g. app.abc123.css)
// .enableVersioning()
;
// export the final configuration
module.exports = Encore.getWebpackConfig();
My base.html.twig:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>{% block title %}Welcome!{% endblock %}</title>
{% block javascripts %}
<script src="{{ asset('build/manifest.js') }}"></script>
<script src="{{ asset('build/vendor.js') }}"></script>
<script src="{{ asset('build/app.js') }}"></script>
<script src="{{ asset('build/manifest.json') }}"></script>
{% endblock %}
{% block stylesheets %}
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<link rel="stylesheet" href="{{ asset('build/theme.css') }}">
<link rel="stylesheet" href="{{ asset('build/vendor.css') }}">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
{% endblock %}
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
</head>
<body>
{% block body %}{% endblock %}
</body>
</html>
Issue Analytics
- State:
- Created 6 years ago
- Comments:8 (4 by maintainers)
Top Results From Across the Web
Manifest: Line: 1, column: 1, Syntax error on Chrome browser
I had the same problem when I moved my Codesandbox project to local. In my case, there was no manifest.json file in the...
Read more >manifest.json is reporting incorrect syntax error, when the ...
JSON - manifest. json is reporting incorrect syntax error, when the syntax is actually following the specs in the documentation. - Visual Studio...
Read more >Manifest: Line 1, column: 1, Syntax error. in React || Solved
Manifest : Line 1, column: 1, Syntax error in react solved .Subscribe this channel to get solution for the programmingError ...
Read more >Line: 1, column: 1, Syntax error. site.webmanifest:1 - 401 error
There is a simple fix that worked for me, just adding crossorigin=”use-credentials” to the import. <link rel="manifest" href="your-path/site.
Read more >React.js: Manifest: Line: 1, column: 1, Syntax error - Reddit
This is my manifest.json in public folder { "short_name": "React App", "name": "Create React App Sample", "icons": [ { "src": "favicon.ico", ...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
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
Yep, just remove the
<script src="{{ asset('build/manifest.json') }}"></script>- this is not needed 😃. This file is not read by the user, but theasset()function (once you’ve configured it in config.yml) will read it behind-the-scenes. Themanifest.jsfile is needed, so keep that.I don’t have more docs, but this is a standard strategy with Webpack version 3 and earlier.