jhnns
commented
9 years ago Yep, that's an error... that's probably not a good fallback to get the base path. @sokra when is __resourceQuery not set?
Closed steveme closed 8 years ago
jhnns
commented
9 years ago Yep, that's an error... that's probably not a good fallback to get the base path. @sokra when is __resourceQuery not set?
sokra
commented
9 years ago It only checks the current script tag, which should be the script tag for the webpack-dev-server client. __resourcePath is used when putting the webpack-dev-server/client?... in the entry. I don't think this is wrong. I think the error is somewhere else:
<script> tag to the WDS client is included with async, defer or inlinedwebpack-dev-server/client is added to the entry point but no host argument is included.
voronianski
commented
9 years ago @sokra @steveme @jhnns I have very similar issue:
webpack-dev-server --hot --inline --progress --colors
70% 1/1 build modules
TypeError: Object /Users/me/github/app-webpack/node_modules/webpack-dev-server/client/index.js?http://localhost:8080,webpack/hot/dev-server,webpack/hot/dev-server has no method 'replace'
at Tapable.<anonymous> (/Users/me/github/app-webpack/node_modules/webpack/lib/NormalModuleFactory.js:42:26)webpack config:
'use strict';
var webpack = require('webpack');
module.exports = {
entry: [
'webpack/hot/dev-server',
'./src/app.js'
],
output: {
path: __dirname + '/public/build/',
filename: 'bundle.js',
publicPath: '/build/'
},
resolve: {
extensions: ['', '.js', '.jsx']
},
module: {
loaders: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loaders: ['babel-loader?experimental']
}
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin()
]
};base.html is served via express server where {{mainJS}} is passed to locals as 'http://localhost:8080/build/bundle.js' (also want to figure out how better serve this in production):
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>App Webpack</title>
</head>
<body>
<div id="app"></div>
<script src="{{mainJS}}"></script>
</body>
</html>
Zache
commented
8 years ago This happens to me because Google Tag Manager inserts a script element at the bottom of the page and Webpack tries to replace the last script element, which no longer is the bundle...
iest
commented
8 years ago Get this exact error too, what @Zache said. Fixed by removing GTM in dev...
MattKunze
commented
8 years ago I'm getting this when I have the redux-devtools Chrome extension active - the extension injects a script into the document which doesn't have a src attribute
micha149
commented
8 years ago I can confirm this problem with the redux devtools chrome extension
tiye
commented
8 years ago Because of defer in our case. I'd like to drop defer.
3LOK
commented
8 years ago We get it because we lazy load our scripts...
hijonathan
commented
8 years ago :eyes: me too
ptz0n
commented
8 years ago Same here. Seems to be related to the defer attribute of the script element.
Update: https://github.com/webpack/webpack-dev-server/pull/447 solves the issue. :+1:
brotzky
commented
8 years ago @Zache the GTM issue was never resolved, correct? I still get Uncaught TypeError: Cannot read property 'replace' of null with GTM in my index.html. This occurs on both 1.14.0 and 1.14.1 for me.
Zache
commented
8 years ago @brotzky I'm not sure, it wasn't GTM itself but rather the tags and our workaround was to remove them from our development env.
brotzky
commented
8 years ago @Zache, I think we will take the same approach. Thanks!
ptz0n
commented
8 years ago Sorry, but I don't get what's hindering us from merging either #447 or #394.
Please merge or clarify 😸
jhnns
commented
8 years ago I've just merged #447 – but now I think, this PR is only removing the error instead of being an actual solution to the problem.
When the url can't be retrieved from the script tag, it will default to / which might be correct in some cases, in some others, however, it will not be correct.
Wouldn't it be better to use document.currentScript? Unfortunately, there are no tests so I don't know if that change would break anything :(
achimnol
commented
8 years ago I have faced this issue with deferred ZenDesk script injection. Looking forward to find a good solution!
brotzky
commented
8 years ago @achimnol @Zache's solution is the simplest. We have a dev and prod index.html that has different 3rd party scripts in them (GTM, LiveChat, Polyfills/Shims, etc). Use the dev index.html in development and then point webpack at the production index.html when running a build. Proven to be the simplest solution for now.
SpaceK33z
commented
8 years ago @jhnns, document.currentScript looks exactly like the thing we want. It also supports scripts that run with async, so it will solve many other issues that were reported.
The only problem is that document.currentScript does not work for IE 6-11. There is a polyfill available, which supports IE6-10, but not IE11.
So what should we do here? Do we support IE?
reem
commented
8 years ago I and several other members of my team are hitting this issue as well and I believe it is just because of chrome extensions that we have. It would be really great if the fix from #447 was backported to v1 even if it's only a temporary solution. Right now we are just stuck refreshing the page until it works, which is a very frustrating side effect of an otherwise amazing tool!
SpaceK33z
commented
8 years ago This issue was fixed in PR #496. It now behaves like this:
document.currentScript if available. This is the most reliable way to get the current script, and works in most browsers.document.scripts.I'm not sure about backporting this to the 1.x branch, because it can potentially break existing setups.
jhnns
commented
8 years ago Awesome! 👍 Great work!
SpaceK33z
commented
8 years ago Released in 2.1.0-beta.3.
Braincompiler
commented
8 years ago Is it also fixed in 1.16.x? We cannot use webpack2 (it tries to resolve our dynamic module loading approach using System.import and we cannot prevent webpack2 from doing this).
SpaceK33z
commented
8 years ago @Braincompiler, yes, this was backported in 1.15.2.
aryzing
commented
6 years ago Not sure if this issue is back, but I'm seeing the error
Warning: React DevTools encountered an error: TypeError: Cannot read property 'replace' of nullas reported by #381. This error is reported the very first time webpack HMRs. Subsequent HMRs do not cause this error to show up. Let me know if you need a repo reproducing the issue.
Hi,
Am seeing a lot of :
Which is from here: https://github.com/webpack/webpack-dev-server/blob/master/client/index.js#L5
As i've got script elements in my markup that don't have a src attribute.
We're using fluxible, so our HTML has inline state in a tag like: https://github.com/yahoo/flux-examples/blob/master/fluxible-router/components/Html.jsx
Thanks.
Steve