I am building a very simple, 'Hello World' style server using MongoDB, React, Babel, Node.js, Webpack, Express, and a couple other software modules. I am able to build, compile, and run said server, but hot-loader never updates the DOM. I get no errors in my terminal and my server otherwise runs fine, but in my browser console I get the following:
Uncaught EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'".
at Object../node_modules/webpack-hot-middleware/client.js?reload=true (bundle.js:1197:1)
at __webpack_require__ (bundle.js:726:30)
at fn (bundle.js:101:20)
at Object.0 (bundle.js:1287:1)
at __webpack_require__ (bundle.js:726:30)
at bundle.js:793:37
at bundle.js:796:10
My non-dev dependencies associated with hot-loader and listed in my package.json are the following (Outdated versions were required for the server I'm making, although I was never told why):
-Node: 13.12.0
-NPM: 6.14.4
-@hot-loader/react-dom: 16.13.0
-Express: 4.17.1
-MongoDB: 3.5.5
-React: 16.13.1
-React-DOM: 16.13.1
-React-hot-loader: 4.12.2
The loader exports my module const (HelloWorld), but only once and never updates it if I change the text in any way. Is there a simple mistake I'm making? I would be happy to provide more code if needed.
My HelloWorld.js, responsible for the export:
import { hot } from 'react-hot-loader'
import React from 'react'
const HelloWorld = () => {
return (
<div>
<h1>Hello World!</h1>
</div>
)
}
export default hot(module)(HelloWorld)
Here is my main.js, responsible for rendering elements in the root:
import { hot } from 'react-hot-loader'
import React from 'react'
import { render } from 'react-dom'
import HelloWorld from './HelloWorld'
render(<HelloWorld/>, document.getElementById('root'))
What should I include in HelloWorld or Main that allows my hot-loader to update my page in real time as quickly as possible? Thank you for your time and I apologize if my question is disorderly or confusing. I often have trouble speaking concisely.
Via Active questions tagged javascript - Stack Overflow https://ift.tt/A1CPclZ
Comments
Post a Comment