Local version of ReactJS not working on IE11, Edge, but remote version works
UPDATE: It turns out this isn't just occurring for local ReactJS scripts, but also for any other local external scripts used on the webpage.
This issue only occurs in Internet Explorer 11 and Edge as far as I know. I'm not sure if it occurs in previous versions of Internet Explorer.
The following code is in the file called index.html
<!DOCTYPE html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body>
<header><div id="header"></div></header>
<div id="scroller"></div>
<script type="text/javascript" src="./js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="./js/react.production.min.js"></script>
<script type="text/javascript" src="./js/react-dom.production.min.js">
</script>
<script type="text/javascript" src="./js/components/scroller.js"></script>
<script type="text/javascript" src="./js/widgets/header.js"></script>
</body>
</html>
What happens is if I attempt to use a local version of React, I get the error
'React' is undefined
However, if I use a remote version of both copies of React it works fine. The same occurs with JQuery when I switch back to the remote version of React while trying to use the local version of JQuery. One solution here I tried was to make sure the files were using the same encoding for the files. I think I was able to make sure they all had the same encoding. However, this did not solve the issue.
What approaches can I go about solving this issue?
javascript jquery reactjs internet-explorer-11 local
add a comment |
UPDATE: It turns out this isn't just occurring for local ReactJS scripts, but also for any other local external scripts used on the webpage.
This issue only occurs in Internet Explorer 11 and Edge as far as I know. I'm not sure if it occurs in previous versions of Internet Explorer.
The following code is in the file called index.html
<!DOCTYPE html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body>
<header><div id="header"></div></header>
<div id="scroller"></div>
<script type="text/javascript" src="./js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="./js/react.production.min.js"></script>
<script type="text/javascript" src="./js/react-dom.production.min.js">
</script>
<script type="text/javascript" src="./js/components/scroller.js"></script>
<script type="text/javascript" src="./js/widgets/header.js"></script>
</body>
</html>
What happens is if I attempt to use a local version of React, I get the error
'React' is undefined
However, if I use a remote version of both copies of React it works fine. The same occurs with JQuery when I switch back to the remote version of React while trying to use the local version of JQuery. One solution here I tried was to make sure the files were using the same encoding for the files. I think I was able to make sure they all had the same encoding. However, this did not solve the issue.
What approaches can I go about solving this issue?
javascript jquery reactjs internet-explorer-11 local
were your serving theindex.htmlin a local http server, or were you opening it directly in browser asfile://?
– William Chong
Nov 21 at 19:27
I was opening it directly in browser. Weirdly enough, some local scripts load, but the ReactJS just won't. I'm investigating further into the issue.
– user3864563
Nov 21 at 19:47
you should always use a simple apache/ other http local server to serve your html when developing in local. This can avoid many SOP and weird issue that won't happen after you go online.
– William Chong
Nov 21 at 19:48
The problem is I'm trying to serve the webpage via a webbrowser control in Visual Studio. However, because of this issue it won't load properly in the control. I was wondering if there would be a way to do this without resorting to having a server run in the background.
– user3864563
Nov 21 at 19:55
add a comment |
UPDATE: It turns out this isn't just occurring for local ReactJS scripts, but also for any other local external scripts used on the webpage.
This issue only occurs in Internet Explorer 11 and Edge as far as I know. I'm not sure if it occurs in previous versions of Internet Explorer.
The following code is in the file called index.html
<!DOCTYPE html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body>
<header><div id="header"></div></header>
<div id="scroller"></div>
<script type="text/javascript" src="./js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="./js/react.production.min.js"></script>
<script type="text/javascript" src="./js/react-dom.production.min.js">
</script>
<script type="text/javascript" src="./js/components/scroller.js"></script>
<script type="text/javascript" src="./js/widgets/header.js"></script>
</body>
</html>
What happens is if I attempt to use a local version of React, I get the error
'React' is undefined
However, if I use a remote version of both copies of React it works fine. The same occurs with JQuery when I switch back to the remote version of React while trying to use the local version of JQuery. One solution here I tried was to make sure the files were using the same encoding for the files. I think I was able to make sure they all had the same encoding. However, this did not solve the issue.
What approaches can I go about solving this issue?
javascript jquery reactjs internet-explorer-11 local
UPDATE: It turns out this isn't just occurring for local ReactJS scripts, but also for any other local external scripts used on the webpage.
This issue only occurs in Internet Explorer 11 and Edge as far as I know. I'm not sure if it occurs in previous versions of Internet Explorer.
The following code is in the file called index.html
<!DOCTYPE html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body>
<header><div id="header"></div></header>
<div id="scroller"></div>
<script type="text/javascript" src="./js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="./js/react.production.min.js"></script>
<script type="text/javascript" src="./js/react-dom.production.min.js">
</script>
<script type="text/javascript" src="./js/components/scroller.js"></script>
<script type="text/javascript" src="./js/widgets/header.js"></script>
</body>
</html>
What happens is if I attempt to use a local version of React, I get the error
'React' is undefined
However, if I use a remote version of both copies of React it works fine. The same occurs with JQuery when I switch back to the remote version of React while trying to use the local version of JQuery. One solution here I tried was to make sure the files were using the same encoding for the files. I think I was able to make sure they all had the same encoding. However, this did not solve the issue.
What approaches can I go about solving this issue?
javascript jquery reactjs internet-explorer-11 local
javascript jquery reactjs internet-explorer-11 local
edited Nov 21 at 19:23
asked Nov 20 at 23:22
user3864563
150216
150216
were your serving theindex.htmlin a local http server, or were you opening it directly in browser asfile://?
– William Chong
Nov 21 at 19:27
I was opening it directly in browser. Weirdly enough, some local scripts load, but the ReactJS just won't. I'm investigating further into the issue.
– user3864563
Nov 21 at 19:47
you should always use a simple apache/ other http local server to serve your html when developing in local. This can avoid many SOP and weird issue that won't happen after you go online.
– William Chong
Nov 21 at 19:48
The problem is I'm trying to serve the webpage via a webbrowser control in Visual Studio. However, because of this issue it won't load properly in the control. I was wondering if there would be a way to do this without resorting to having a server run in the background.
– user3864563
Nov 21 at 19:55
add a comment |
were your serving theindex.htmlin a local http server, or were you opening it directly in browser asfile://?
– William Chong
Nov 21 at 19:27
I was opening it directly in browser. Weirdly enough, some local scripts load, but the ReactJS just won't. I'm investigating further into the issue.
– user3864563
Nov 21 at 19:47
you should always use a simple apache/ other http local server to serve your html when developing in local. This can avoid many SOP and weird issue that won't happen after you go online.
– William Chong
Nov 21 at 19:48
The problem is I'm trying to serve the webpage via a webbrowser control in Visual Studio. However, because of this issue it won't load properly in the control. I was wondering if there would be a way to do this without resorting to having a server run in the background.
– user3864563
Nov 21 at 19:55
were your serving the
index.html in a local http server, or were you opening it directly in browser as file://?– William Chong
Nov 21 at 19:27
were your serving the
index.html in a local http server, or were you opening it directly in browser as file://?– William Chong
Nov 21 at 19:27
I was opening it directly in browser. Weirdly enough, some local scripts load, but the ReactJS just won't. I'm investigating further into the issue.
– user3864563
Nov 21 at 19:47
I was opening it directly in browser. Weirdly enough, some local scripts load, but the ReactJS just won't. I'm investigating further into the issue.
– user3864563
Nov 21 at 19:47
you should always use a simple apache/ other http local server to serve your html when developing in local. This can avoid many SOP and weird issue that won't happen after you go online.
– William Chong
Nov 21 at 19:48
you should always use a simple apache/ other http local server to serve your html when developing in local. This can avoid many SOP and weird issue that won't happen after you go online.
– William Chong
Nov 21 at 19:48
The problem is I'm trying to serve the webpage via a webbrowser control in Visual Studio. However, because of this issue it won't load properly in the control. I was wondering if there would be a way to do this without resorting to having a server run in the background.
– user3864563
Nov 21 at 19:55
The problem is I'm trying to serve the webpage via a webbrowser control in Visual Studio. However, because of this issue it won't load properly in the control. I was wondering if there would be a way to do this without resorting to having a server run in the background.
– user3864563
Nov 21 at 19:55
add a comment |
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53403110%2flocal-version-of-reactjs-not-working-on-ie11-edge-but-remote-version-works%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53403110%2flocal-version-of-reactjs-not-working-on-ie11-edge-but-remote-version-works%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
were your serving the
index.htmlin a local http server, or were you opening it directly in browser asfile://?– William Chong
Nov 21 at 19:27
I was opening it directly in browser. Weirdly enough, some local scripts load, but the ReactJS just won't. I'm investigating further into the issue.
– user3864563
Nov 21 at 19:47
you should always use a simple apache/ other http local server to serve your html when developing in local. This can avoid many SOP and weird issue that won't happen after you go online.
– William Chong
Nov 21 at 19:48
The problem is I'm trying to serve the webpage via a webbrowser control in Visual Studio. However, because of this issue it won't load properly in the control. I was wondering if there would be a way to do this without resorting to having a server run in the background.
– user3864563
Nov 21 at 19:55