CODEWITHSUNDEEP
javascriptvisual-studio-codegatsby
devopsrc
devopsrc

Reputation: 3

Unexpected character error in VS Code for a Gatsby webpage

I am receiving the following error when starting the dev server:

Syntax error in ... "\gatsby-browser.js" Unexpected character (unknown character: question mark in diamond). (1:0). text from code below follows, but every other character is red space and first two are unknown characters

The code for gatsby-browser.js is

import { rootWrapper } from "./root-wrapper";

export const wrapPageElement = rootWrapper;

and the code for root-wrapper.js is:

import React from 'react';
import { Layout } from "./src/components/layout";

export const rootWrapper = ({ element }) => {
    return <Layout>{element}</Layout>;
};

Any thoughts on what would be causing this error? I've never seen the pink/red bars in an error on VS Code before.

Upvotes: 0

Views: 229

Answers (2)

myf
myf

Reputation: 11293

Check character encoding of that file (bottom right corner of status bar), what does it read?

Alternatively try to change the encoding: either by clicking that status bar item or invoking Change File Encoding command and then Save with Encoding, then choose UTF-8 (that one without BOM).

Upvotes: 2

JCrook
JCrook

Reputation: 469

I believe this is due to an extension running within your VSCode environment?

Try disabling any extensions you have first, especially ones that relate to your project and syntax

Upvotes: 0

Related Questions