-
Notifications
You must be signed in to change notification settings - Fork 50
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
SyntaxError: The URL 'http:/ sockjs-node' is invalid #40
Comments
@mitinarseny Example: {
test: /src[\\/]index\.html$/,
use: [
{
// It is possible to get rid of this `cacheDependencyLoader` when the following PR is merged
// https://github.com/GoogleChromeLabs/prerender-loader/pull/39
// @see https://github.com/GoogleChromeLabs/prerender-loader/issues/34
loader: `${__dirname}/cacheDependencyLoader.js`,
options: {
dependencies: [`${__dirname}/src/**/*.tsx?`],
},
},
{
loader: 'prerender-loader',
options: {
string: true,
entry: `./src/index.ts`,
},
},
],
}, |
In plugins: [
new HtmlWebpackPlugin({
template: "!!prerender-loader?string&entry=./src/index!./src/index.html",
scriptLoading: "defer",
}),
...
] |
This problem can also be avoided by writing Note: webpack.config.js // [email protected] [email protected] [email protected] [email protected]
module.exports = {
entry: "./src/index",
plugins: [
new HtmlWebpackPlugin({
template: "!!prerender-loader?string!./src/index.html",
scriptLoading: "defer",
}),
],
resolve: { extensions: [".ts", ".tsx", ".js", ".jsx"] },
// and so on ...
}; src/index.tsx // [email protected] [email protected]
import React from "react";
import { hydrate } from "react-dom";
import App from "./App";
hydrate(<App />, document.getElementById("root")); src/App.tsx import React, { useCallback, useState } from "react";
const App: React.FC = () => {
const [count, setCount] = useState(0);
const onclick = useCallback(() => setCount((c) => c + 1), []);
return (
<>
<h1>{count}</h1>
<button onClick={onclick}>add</button>
</>
);
};
export default App; src/index.html <!DOCTYPE html>
<html>
<head>
<title>title</title>
</head>
<body>
<div id="root">{{prerender:./src/entry.tsx}}</div>
</body>
</html> src/entry.tsx import React from "react";
import { renderToString } from "react-dom/server";
import App from "./App";
export default (): string => renderToString(<App />); Notations like |
Fails even if installled only (via
yarn add --dev prerender-loader
) and with following code (commented is really commented):Produces error when
webpack --mode production
and open file in browser orwebpack-dev-server --mode development
and navigate tolocalhost:8080
:Info
yarn info webpack
The text was updated successfully, but these errors were encountered: