Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

No go. Failed to Compile.. #9

Open
zipzit opened this issue Jul 25, 2020 · 2 comments
Open

No go. Failed to Compile.. #9

zipzit opened this issue Jul 25, 2020 · 2 comments

Comments

@zipzit
Copy link

zipzit commented Jul 25, 2020

git clone ...,, npm install, then npm start -->

$ npm start

> [email protected] start C:\temp\books
> react-scripts start

i 「wds」: Project is running at http://192.168.56.1/
i 「wds」: webpack output is served from
i 「wds」: Content not from webpack is served from C:\temp\books\public
i 「wds」: 404s will fallback to /
Starting the development server...

Failed to compile.

./src/components/loader.js
Error: C:\temp\books\src\components\loader.js: transform-react-jsx: pragma has been set but pragmaFrag has not been set

Branch = master. Not sure what that error message is all about.

When I load the project up in VSCode, I see an error in loader.js The error message: Type annotations can only be used in TypeScript files. And the error is pointing at the line:
const Loader: React.FunctionComponent<{}> = ({ loading, children }) => {

@zipzit
Copy link
Author

zipzit commented Jul 25, 2020

If I change the line: const Loader: React.FunctionComponent<{}> = ({ loading, children }) => {
to: const Loader = ({ loading, children }) => { I get rid of the error message, but I get the same compiler error
c:\Temp\books\src\components\loader.js: transform-react-jsx: pragma has been set but pragmaFrag has not been set

I will say its not at all clear to me on what the file loader.js does here.

@zipzit
Copy link
Author

zipzit commented Jul 26, 2020

I did see this issue, which seems to be related.

I was able to get a successful run after making the following two modifications to /src/components/loader.js file

  • Remove the line /** @jsx jsx */. Replace it with /** @jsxFrag React.Fragment */

  • Change the line const Loader: React.FunctionComponent<{}> = ({ loading, children }) => { to: const Loader = ({ loading, children }) => {

I still get warnings, but the program does compile. Warning = Line 3:15: 'jsx' is defined but never used no-unused-vars

Heck, if I remove all the JSX stuff in total from that file, it compiles without warnings. If I shut off my internet connection I do see a "fetching books for... " message. With internet connected, that message never displays, as things work pretty quickly. Again, its not totally clear on what JSX offers to the loader file.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants
@zipzit and others