Ошибка разбора конфигурации line 1 column 1 syntax error - Исправление ошибок и поиск оптимальных решений проблем

I have a react app that built through npm run build. GET and POST request from the front-end to back-end gives status 200 but I am getting a weird error that may cause all the images from my files not appear on localhost.

I have already tried to reinstall node, added ‘manifest_version’: 2 as it is the current version of chrome manifest.

Click here for inspect screenshot

Manifest: Line: 1, column: 1, Syntax error.
Below is my index.html file

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
    <meta name="theme-color" content="#000000">
    <link rel="manifest" href="/manifest.json">
    <link rel="shortcut icon" href="/favicon.ico">
    <title>Django React Boilerplate</title>
    <link href="/static/css/2.87ad9c80.chunk.css" rel="stylesheet">
</head>

<body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
    <script>
        ! function(l) {
            function e(e) {
                for (var r, t, n = e[0], o = e[1], u = e[2], f = 0, i = []; f < n.length; f++) t = n[f], p[t] && i.push(p[t][0]), p[t] = 0;
                for (r in o) Object.prototype.hasOwnProperty.call(o, r) && (l[r] = o[r]);
                for (s && s(e); i.length;) i.shift()();
                return c.push.apply(c, u || []), a()
            }

            function a() {
                for (var e, r = 0; r < c.length; r++) {
                    for (var t = c[r], n = !0, o = 1; o < t.length; o++) {
                        var u = t[o];
                        0 !== p[u] && (n = !1)
                    }
                    n && (c.splice(r--, 1), e = f(f.s = t[0]))
                }
                return e
            }
            var t = {},
                p = {
                    1: 0
                },
                c = [];

            function f(e) {
                if (t[e]) return t[e].exports;
                var r = t[e] = {
                    i: e,
                    l: !1,
                    exports: {}
                };
                return l[e].call(r.exports, r, r.exports, f), r.l = !0, r.exports
            }
            f.m = l, f.c = t, f.d = function(e, r, t) {
                f.o(e, r) || Object.defineProperty(e, r, {
                    enumerable: !0,
                    get: t
                })
            }, f.r = function(e) {
                "undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {
                    value: "Module"
                }), Object.defineProperty(e, "__esModule", {
                    value: !0
                })
            }, f.t = function(r, e) {
                if (1 & e && (r = f(r)), 8 & e) return r;
                if (4 & e && "object" == typeof r && r && r.__esModule) return r;
                var t = Object.create(null);
                if (f.r(t), Object.defineProperty(t, "default", {
                        enumerable: !0,
                        value: r
                    }), 2 & e && "string" != typeof r)
                    for (var n in r) f.d(t, n, function(e) {
                        return r[e]
                    }.bind(null, n));
                return t
            }, f.n = function(e) {
                var r = e && e.__esModule ? function() {
                    return e.default
                } : function() {
                    return e
                };
                return f.d(r, "a", r), r
            }, f.o = function(e, r) {
                return Object.prototype.hasOwnProperty.call(e, r)
            }, f.p = "/";
            var r = window.webpackJsonp = window.webpackJsonp || [],
                n = r.push.bind(r);
            r.push = e, r = r.slice();
            for (var o = 0; o < r.length; o++) e(r[o]);
            var s = n;
            a()
        }([])
    </script>
    <script src="/static/js/2.e5ee7667.chunk.js"></script>
    <script src="/static/js/main.9f678b97.chunk.js"></script>
</body>

</html>

It appeared that the error starts from the beginning of my index.html file.

Источник

Содержание

Nextjs error with manifest.json: Manifest: Line: 1, column: 1, Syntax error. #9621
Comments
Describe the bug
Expected behavior
System information
This comment has been minimized.
Footer
Web manifest: Line: 1, column: 1, Syntax error
Answer by Johnny Coleman
Answer by Wallace English
Answer by Nehemiah Lawson
Answer by Brianna Garza
Answer by George Gates
Answer by Ander Schroeder
Answer by Silas Schroeder
Что означает ошибка SyntaxError: invalid syntax
Что делать с ошибкой SyntaxError: invalid syntax
Практика
«Ожидается значение, строка 1, столбец 1 (символ 0)» Ошибка
[Fixed] JSONDecodeError: Expecting Value: Line 1 column 1 (char 0)
How can JSONDecodeError: Expecting value: line 1 column 1 (char 0) occur?
2. Empty JSON file
3. XML output (that is, a string starting with
Resolving JSONDecodeError: Expecting value: line 1 column 1 (char 0)
1. Solution for Non-JSON conforming quoting
2. Solution for empty JSON file
3. Solution for XML output(that is, a string starting with
JSONDecodeError: Expecting value: line 1 column 1 (char 0) Django
Are you facing this error in Flask?
Conclusion JSONDecodeError: Expecting value: line 1 column 1 (char 0)

Nextjs error with manifest.json: Manifest: Line: 1, column: 1, Syntax error. #9621

Describe the bug

Error: Manifest: Line: 1, column: 1, Syntax error.

When I open the route to our manifest http://localhost:3000/static/manifest.json I just get our standard error page html response.

My manifest.json file:

This is how manifest is reference inside :

I have tried answers provided in google:

I’m using current latest version of nextjs: 9.1.4

But nothing seems to work

Expected behavior

I expect manifest.json to actually work

System information

OS: macOS
Browser: All of them
Version of Next.js: 9.1.4

The text was updated successfully, but these errors were encountered:

I swear I went to lunch and came back and now it suddenly works wtf!

apart from .next dir does nextjs save state or cache in somewhere?

This could be just browser cache for /static/manifest.json , which returned an HTML error the first time you hit that URL (e.g. because at some point your file was linked from your page, but did not exist).

You can put manifest.json into public folder – the URL will be just
. This location is preferred over static since Next.js 9.1, when public folder support was introduced.

This issue comes up first when searching for Vercel and manifest.json errors, so just in case this is useful for others.

When browsers see
they request /manifest.json without domain cookies.

The request for the manifest is made without any credentials (even if it’s on the same domain)

So if the HTTP response varies based on cookies (eg. if the site has password security, like Vercel’s Password Protection site security feature) then the server might respond to /manifest.json with things that aren’t JSON, but the browser attempts to parse it as JSON and this results in a syntax error.

The fix is to either remove password security, or add crossorigin=»use-credentials» attribute to your
per that Stackoverflow thread.

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

You can’t perform that action at this time.

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.

Источник

Web manifest: Line: 1, column: 1, Syntax error

Answer by Johnny Coleman

I had the exact same problem (on an Azure Windows Web Service). I just created a new web.config in the root folder with the following content (or edit the existing, if there is one):,If your manifest file is at root level (where your index.html is) you can reference to it like the following in the tag of your index.html file:, What if particle colliders cannot find anything beyond the standard model?

I had the exact same problem (on an Azure Windows Web Service). I just created a new web.config in the root folder with the following content (or edit the existing, if there is one):

Answer by Wallace English

You should then set your web server to automatically serve the index.html file (this is often enabled per default). ,I had the exact same problem (on an Azure Windows Web Service). I just created a new web.config in the root folder with the following content (or edit the existing, if there is one):,If your manifest file is at root level (where your index.html is) you can reference to it like the following in the tag of your index.html file:

If your manifest file is at root level (where your index.html is) you can reference to it like the following in the tag of your index.html file:

Otherwise if you would serve your app with a specific base url, you should reflect it in the startUrl property:

I had the exact same problem (on an Azure Windows Web Service). I just created a new web.config in the root folder with the following content (or edit the existing, if there is one):

For me it was so simple to fix , just a matter of code orgnizing in the index.html , the following link tag has to be on top of the few copied from the favicon generator , just bellow the meta tags

Answer by Nehemiah Lawson

This is my manifest.json in public folder,add crossorigin=»use-credentials»into link tag on indext.html of public folder,edited follwing object on manifest.json< «start_url»: «./», «display»: «standalone», «theme_color»: «#000000», «background_color»: «#ffffff» >

This is my manifest.json in public folder

this link I have in the index.html

Answer by Brianna Garza

Error: Manifest: Line: 1, column: 1, Syntax error.,When I open the route to our manifest http://localhost:3000/static/manifest.jsonI just get our standard error page html response.,I expect manifest.json to actually work

Answer by George Gates

Answer by Ander Schroeder

Answer by Silas Schroeder

I’m using Vuejs to create a PWA as a school project, and whenever I host the website with Azure this happens, I don’t have the problem on localhost. Chrome devtools responds with this:,I had the exact same problem (on an Azure Windows Web Service). I just created a new web.config in the root folder with the following content (or edit the existing, if there is one):,Normally you don’t have a web.config file with Vuejs, but I even tried adding one which looks like this:

I’m using Vuejs to create a PWA as a school project, and whenever I host the website with Azure this happens, I don’t have the problem on localhost. Chrome devtools responds with this:

Источник

Что означает ошибка SyntaxError: invalid syntax

Когда Python не может разобраться в ваших командах

Ситуация: программист взял в работу математический проект — ему нужно написать код, который будет считать функции и выводить результаты. В задании написано:

«Пусть у нас есть функция f(x,y) = xy, которая перемножает два аргумента и возвращает полученное значение».

Программист садится и пишет код:

Но при выполнении такого кода компьютер выдаёт ошибку:

File «main.py», line 13
result = x y
^
❌ SyntaxError: invalid syntax

Почему так происходит: в каждом языке программирования есть свой синтаксис — правила написания и оформления команд. В Python тоже есть свой синтаксис, по которому для умножения нельзя просто поставить рядом две переменных, как в математике. Интерпретатор находит первую переменную и думает, что ему сейчас объяснят, что с ней делать. Но вместо этого он сразу находит вторую переменную. Интерпретатор не знает, как именно нужно их обработать, потому что у него нет правила «Если две переменные стоят рядом, их нужно перемножить». Поэтому интерпретатор останавливается и говорит, что у него лапки.

Что делать с ошибкой SyntaxError: invalid syntax

В нашем случае достаточно поставить звёздочку (знак умножения в Python) между переменными — это оператор умножения, который Python знает:

В общем случае найти источник ошибки SyntaxError: invalid syntax можно так:

Проверьте, не идут ли у вас две команды на одной строке друг за другом.
Найдите в справочнике описание команды, которую вы хотите выполнить. Возможно, где-то опечатка.
Проверьте, не пропущена ли команда на месте ошибки.

Практика

Попробуйте найти ошибки в этих фрагментах кода:

Источник

«Ожидается значение, строка 1, столбец 1 (символ 0)» Ошибка

«Ожидается значение, строка 1, столбец 1 (символ 0)». Ошибка — это ошибка, с которой пользователи могут столкнуться как на компьютерах Windows, так и на Mac. Часто разработчики программного обеспечения видят это сообщение при попытке протестировать кусок кода, который они только что написали, потому что они сделали ошибку в строке 1, как следует из сообщения. Однако вполне возможно, что даже обычные пользователи могут в конечном итоге увидеть ошибку «Ожидаемое значение, строка 1, столбец 1 (символ 0)», потому что один из файлов, используемых их программным обеспечением, был поврежден или поврежден. Хорошая новость заключается в том, что это сообщение об ошибке ни в коем случае не является серьезным, и вы не должны слишком беспокоиться по этому поводу. Однако иногда это может привести к зависанию приложения или отказу в работе.

Если приложение, которое вызвало ошибку «Ожидаемое значение, строка 1, столбец 1 (символ 0)», зависло, мы советуем вам прекратить его работу с помощью диспетчера задач Windows или монитора активности Mac. Обычно для решения проблемы достаточно перезапуска проблемного приложения, но иногда сообщение об ошибке может сохраняться. Если ваша программа продолжает создавать сообщения об ошибке «Ожидаемое значение, строка 1, столбец 1 (символ 0)», когда вы запускаете ее, мы предлагаем вам полностью удалить ее.

Источник

[Fixed] JSONDecodeError: Expecting Value: Line 1 column 1 (char 0)

JSONDecodeError: Expecting value: line 1 column 1 (char 0) occurs while working with JSON (JavaScript Object Notation) format. You might be storing some data or trying to fetch JSON data from an API(Application Programming Interface). In this guide, we will discuss where it can creep in and how to resolve it.

How can JSONDecodeError: Expecting value: line 1 column 1 (char 0) occur?

JSONDecodeError means there is an incorrect JSON format being followed. For instance, the JSON data may be missing a curly bracket, have a key that does not have a value, and data not enclosed within double-quotes or some other syntactic error.

Generally, the error expecting value: line 1 column 1 (char 0) error can occur due to the following reasons.

Non-JSON conforming quoting
Empty JSON file
XML output (that is, a string starting with 1. Non-JSON conforming quoting

JSON or JavaScript Object Notation has a similar format to that of the python dictionary datatype. A dictionary requires a key or value to be enclosed in quotes if it is a string. Similarly, the JSON standard defines that keys need not be a string. However, keys should always be enclosed within double quotes. Not following this standard can also raise an error.

2. Empty JSON file

For this example, we have taken an empty JSON file named test.py and another file named test.py, which contains the code given below. Using context manager, we open the JSON file in reading mode and load it using the load method. However, an error is thrown because the JSON file is empty.

3. XML output (that is, a string starting with

The Extensible Markup Language, or simply XML, is a simple text-based format for representing structured information: documents, data, configuration, books, transactions, invoices, and much more. Similar to JSON, it is an older way of storing data. Earlier APIs used to return data in XML format ; however, JSON is nowadays the preferred choice. Let’s see how we can face the expecting value: line 1 column 1 (char 0) type error in this case.

Let’s break down what is happening here.

For ease of example, suppose API returns an XML format data, as shown above.
Now, when we try to load that response from API, we will get a type error.

Resolving JSONDecodeError: Expecting value: line 1 column 1 (char 0)

1. Solution for Non-JSON conforming quoting

To resolve the type error in this case, you need to ensure that the keys and values are enclosed within the double quotes. This is necessary because it is a part of JSON syntax. It is important to realize that JSON only uses double quotes, not single quotes.

2. Solution for empty JSON file

The solution for this is self-evident in the name. To resolve the type error, in this case, make sure that the JSON file or the response from an API is not empty. If the file is empty, add content to it, and for a response from an API, use try-except to handle the error, which can be empty JSON or a 404 error, for instance.

The above code takes in a word and returns all the information related to it in a JSON format. Now in order to show how we can handle the Expecting value: line 1 column 1 (char 0) type error, we have altered the URL. entries have been changed to enties. Therefore we will get an invalid response which will not be of the JSON format. However, this is merely done to imitate the error when you might get an invalid response from an API.

Now, if you try to run the code above, you will be prompted to enter a word. The response is saved into the data variable and later converted to a string.
However, in the try block json.loads method, which parses JSON string to python dictionary raises an error.
This is because the response sent by API is not of JSON format, hence can’t be parsed, resulting in JSONDecodeError.
JSONDecodeError gets handled by the try-except block, and a “Response content is not valid JSON” gets printed as an outcome.

3. Solution for XML output(that is, a string starting with

To avoid type errors resulting from an XML format, we will convert it to a JSON format. However, firstly install this library.

Let’s elaborate on the code above:

We have imported two libraries, namely JSON and xmltodict.
Using the context manager with, XML file test.xml is opened in read mode. Thereafter using the xmltodict parse method, it is converted to a dictionary type, and the file is closed.
json.dumps() takes in a JSON object and returns a string of that object.
Again using context manager with, a JSON file is created, XML data that was converted to a JSON string is written on it, and the file is closed.

JSONDecodeError: Expecting value: line 1 column 1 (char 0) Django

This issue is caused by the failure of Pipenv 2018.10.9. To resolve this issue, use Pipenv 2018.5.18. For more, read here.

Are you facing this error in Flask?

Many times, when you receive the data from HTTP requests, they are fetched as bytes. So, if you face JSONDecodeError, you might be dealing with a JSON in bytes. First, you need to decode the JSON by using response.decode(‘utf-8’) . This will create a string, and then you can parse it.

json.loads() method can be used to parse JSON in python. For instance:
import json
json_string = ‘<«a»:»1″, «b»:»2″, «c»:»3″>‘
json_to_dict = json.loads(json_string)
print(json_to_dict)
print(type(json_to_dict))

import os
file_path = «/home/nikhilomkar/Desktop/test.json»
print(«File is empty!» if os.stat(file_path).st_size == 0 else «File isn’t empty!» )
The following code checks if the file is empty and prints the File is empty! If true, else, the File isn’t empty!.

Conclusion JSONDecodeError: Expecting value: line 1 column 1 (char 0)

The following article discussed the JSONDecodeError: Expecting value: line 1 column 1 (char 0). This error is due to various decoding and formatting errors. We looked at likely situations where it can occur and how to resolve it.

Источник

I have already tried to reinstall node, added ‘manifest_version’: 2 as it is the current version of chrome manifest.

Click here for inspect screenshot

Manifest: Line: 1, column: 1, Syntax error.
Below is my index.html file

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
    <meta name="theme-color" content="#000000">
    <link rel="manifest" href="/manifest.json">
    <link rel="shortcut icon" href="/favicon.ico">
    <title>Django React Boilerplate</title>
    <link href="/static/css/2.87ad9c80.chunk.css" rel="stylesheet">
</head>

<body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
    <script>
        ! function(l) {
            function e(e) {
                for (var r, t, n = e[0], o = e[1], u = e[2], f = 0, i = []; f < n.length; f++) t = n[f], p[t] && i.push(p[t][0]), p[t] = 0;
                for (r in o) Object.prototype.hasOwnProperty.call(o, r) && (l[r] = o[r]);
                for (s && s(e); i.length;) i.shift()();
                return c.push.apply(c, u || []), a()
            }

            function a() {
                for (var e, r = 0; r < c.length; r++) {
                    for (var t = c[r], n = !0, o = 1; o < t.length; o++) {
                        var u = t[o];
                        0 !== p[u] && (n = !1)
                    }
                    n && (c.splice(r--, 1), e = f(f.s = t[0]))
                }
                return e
            }
            var t = {},
                p = {
                    1: 0
                },
                c = [];

            function f(e) {
                if (t[e]) return t[e].exports;
                var r = t[e] = {
                    i: e,
                    l: !1,
                    exports: {}
                };
                return l[e].call(r.exports, r, r.exports, f), r.l = !0, r.exports
            }
            f.m = l, f.c = t, f.d = function(e, r, t) {
                f.o(e, r) || Object.defineProperty(e, r, {
                    enumerable: !0,
                    get: t
                })
            }, f.r = function(e) {
                "undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {
                    value: "Module"
                }), Object.defineProperty(e, "__esModule", {
                    value: !0
                })
            }, f.t = function(r, e) {
                if (1 & e && (r = f(r)), 8 & e) return r;
                if (4 & e && "object" == typeof r && r && r.__esModule) return r;
                var t = Object.create(null);
                if (f.r(t), Object.defineProperty(t, "default", {
                        enumerable: !0,
                        value: r
                    }), 2 & e && "string" != typeof r)
                    for (var n in r) f.d(t, n, function(e) {
                        return r[e]
                    }.bind(null, n));
                return t
            }, f.n = function(e) {
                var r = e && e.__esModule ? function() {
                    return e.default
                } : function() {
                    return e
                };
                return f.d(r, "a", r), r
            }, f.o = function(e, r) {
                return Object.prototype.hasOwnProperty.call(e, r)
            }, f.p = "/";
            var r = window.webpackJsonp = window.webpackJsonp || [],
                n = r.push.bind(r);
            r.push = e, r = r.slice();
            for (var o = 0; o < r.length; o++) e(r[o]);
            var s = n;
            a()
        }([])
    </script>
    <script src="/static/js/2.e5ee7667.chunk.js"></script>
    <script src="/static/js/main.9f678b97.chunk.js"></script>
</body>

</html>

It appeared that the error starts from the beginning of my index.html file.

Источник

Answer by Johnny Coleman

What if particle colliders cannot find anything beyond the standard model?

I had the exact same problem (on an Azure Windows Web Service). I just created a new web.config in the root folder with the following content (or edit the existing, if there is one):

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <system.webServer>
    <staticContent>
      <mimeMap fileExtension=".json" mimeType="application/json" />
    </staticContent>
    <modules runAllManagedModulesForAllRequests="true"/>
  </system.webServer>
</configuration>

Answer by Wallace English

If your manifest file is at root level (where your index.html is) you can reference to it like the following in the <head> tag of your index.html file:

<link rel="manifest" crossorigin="use-credentials" href="manifest.json"/>

Otherwise if you would serve your app with a specific base url, you should reflect it in the startUrl property:

Example: 

-->  www.myapp.com/my-other-url-part/

Use:
    "start_url": "/my-other-url-part/"

Or simply:
    "start_url": "./"   <-- This would match any base-href != "/"

I had the exact same problem (on an Azure Windows Web Service). I just created a new web.config in the root folder with the following content (or edit the existing, if there is one):

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <system.webServer>
    <staticContent>
      <mimeMap fileExtension=".json" mimeType="application/json" />
    </staticContent>
    <modules runAllManagedModulesForAllRequests="true"/>
  </system.webServer>
</configuration>

For me it was so simple to fix , just a matter of code orgnizing in the index.html , the following link tag has to be on top of the few copied from the favicon generator , just bellow the meta tags

<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

Answer by Nehemiah Lawson

This is my manifest.json in public folder,add crossorigin=»use-credentials»into link tag on indext.html of public folder,edited follwing object on manifest.json{ «start_url»: «./», «display»: «standalone», «theme_color»: «#000000», «background_color»: «#ffffff» }

This is my manifest.json in public folder

{   "short_name": "React App",   "name": "Create React App Sample",   "icons": [     {       "src": "favicon.ico",       "sizes": "64x64 32x32 24x24 16x16",       "type": "image/x-icon"     },     {       "src": "logo192.png",       "type": "image/png",       "sizes": "192x192"     },     {       "src": "logo512.png",       "type": "image/png",       "sizes": "512x512"     }   ],   "start_url": ".",   "display": "standalone",   "theme_color": "#000000",   "background_color": "#ffffff" }

this link I have in the index.html

<link rel="manifest" crossorigin="use-credentials" href="%PUBLIC_URL%/manifest.json" />

Answer by Brianna Garza

{
  "name": "Foo",
  "short_name": "foo",
  "start_url": "/",
  "background_color": "#ffffff",
  "theme_color": "#00427b",
  "display": "minimal-ui",
  "orientation": "portrait-primary",
  "icons": [
    { "src": "/static/images/logo/icon-48x48.png", "sizes": "48x48", "type": "image/png" },
    { "src": "/static/images/logo/icon-72x72.png", "sizes": "72x72", "type": "image/png" },
    { "src": "/static/images/logo/icon-96x96.png", "sizes": "96x96", "type": "image/png" },
    { "src": "/static/images/logo/icon-144x144.png", "sizes": "144x144", "type": "image/png" },
    { "src": "/static/images/logo/icon-192x192.png", "sizes": "192x192", "type": "image/png" },
    { "src": "/static/images/logo/icon-256x256.png", "sizes": "256x256", "type": "image/png" },
    { "src": "/static/images/logo/icon-384x384.png", "sizes": "384x384", "type": "image/png" },
    { "src": "/static/images/logo/icon-512x512.png", "sizes": "512x512", "type": "image/png" }
  ]
}

Answer by George Gates

{  "short_name": "React App",  "name": "Create React App Sample",  "icons": [    {      "src": "favicon.ico",      "sizes": "64x64 32x32 24x24 16x16",      "type": "image/x-icon"    },    {      "src": "logo192.png",      "type": "image/png",      "sizes": "192x192"    },    {      "src": "logo512.png",      "type": "image/png",      "sizes": "512x512"    }  ],  "start_url": ".",  "display": "standalone",  "theme_color": "#000000",  "background_color": "#ffffff"}

Answer by Ander Schroeder

Answer by Silas Schroeder

I’m using Vuejs to create a PWA as a school project, and whenever I host the website with Azure this happens, I don’t have the problem on localhost…
Chrome devtools responds with this:,I had the exact same problem (on an Azure Windows Web Service). I just created a new web.config in the root folder with the following content (or edit the existing, if there is one):,Normally you don’t have a web.config file with Vuejs, but I even tried adding one which looks like this:

I’m using Vuejs to create a PWA as a school project, and whenever I host the website with Azure this happens, I don’t have the problem on localhost…
Chrome devtools responds with this:

/manifest.json:1 Failed to load resource: the server responded with a status of 404 ()
/manifest.json:1 Manifest: Line: 1, column: 1, Syntax error.
manifest.json:1 GET https://serviceworkerspike.azurewebsites.net/manifest.json 404
manifest.json:1 Manifest: Line: 1, column: 1, Syntax error.

I have this added in my index.html:

<link rel="manifest" href="/manifest.json">

This is my manifest.json file:

{
  "name": "MessageBoardUCN",
  "short_name": "MessageBoardUCN",
  "theme_color": "#ff095a",
  "background_color": "#feaaee",
  "display": "standalone",
  "start_url": "/index.html",
  "icons": [
    {
      "src": "images/icons/icon-72x72.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "images/icons/icon-96x96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "images/icons/icon-128x128.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "images/icons/icon-144x144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "images/icons/icon-152x152.png",
      "sizes": "152x152",
      "type": "image/png"
    },
    {
      "src": "images/icons/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "images/icons/icon-384x384.png",
      "sizes": "384x384",
      "type": "image/png"
    },
    {
      "src": "images/icons/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "splash_pages": null
}

Normally you don’t have a web.config file with Vuejs, but I even tried adding one which looks like this:

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
  <system.webServer>
    <staticContent>
      <remove fileExtension=".json" />
      <mimeMap fileExtension=".json" mimeType="application/json" />
      <mimeMap fileExtension=".webmanifest" mimeType="application/manifest+json" />
    </staticContent>
  </system.webServer>
</configuration>

Источник