How build Typescript with imported packages properly for IE11 using Bable 7 and Webpack 4?Using webpack with 'react-hot', 'babel-loader'How to include untyped node modules with Typescript 1.8?“exclude” options of babel-loader in WebpackIs Babel still necessary when using Typescript and Electron?Typescript (at-loader) compiler errors in WebPackHow to select node_modules dist flavor to bundled with webpackGot “TS2300: Duplicate identifier 'Account'” error after upgraded to Typescript 2.9.1TypeScript definition for StoreEnhancer prevents rest parametersWhy am I not getting the exported Object when importing in another Typescript project?Webpack build is throwing “.sourceMap is an alias for .sourceMaps, cannot use both”
Difference between system uptime and last boot time in windows
Why is the car dealer insisting on a loan instead of cash?
International Orange?
In what state are satellites left in when they are left in a graveyard orbit?
What explanation do proponents of a Scotland-NI bridge give for it breaking Brexit impasse?
Is a suit against a University Dorm for changing policies on a whim likely to succeed (USA)?
What are the advantages and disadvantages of tail wheels that cause modern airplanes to not use them?
Why is my fire extinguisher emptied after one use?
How to modify this code to add more vertical space in timeline that uses Tikz
How to control the output voltage of a solid state relay
How to draw a Venn diagram for X - (Y intersect Z)?
What is the source of "You can achieve a lot with hate, but even more with love" (Shakespeare?)
In what sequence should an advanced civilization teach technology to medieval society to maximize rate of adoption?
What organs or modifications would be needed for a life biological creature not to require sleep?
Access parent controller attribute from Visual force component
How do we know that black holes are spinning?
Unable to find solution to 6 simultaneous equations
How To Make Earth's Oceans as Brackish as Lyr's
Why is the year in this ISO timestamp not 2019?
Are there objective criteria for classifying consonance v. dissonance?
What does "boys rule, girls drool" mean?
How to publish superseding results without creating enemies
Is the Dodge action perceptible to other characters?
What is the blues term for the note between the minor third and the major third?
How build Typescript with imported packages properly for IE11 using Bable 7 and Webpack 4?
Using webpack with 'react-hot', 'babel-loader'How to include untyped node modules with Typescript 1.8?“exclude” options of babel-loader in WebpackIs Babel still necessary when using Typescript and Electron?Typescript (at-loader) compiler errors in WebPackHow to select node_modules dist flavor to bundled with webpackGot “TS2300: Duplicate identifier 'Account'” error after upgraded to Typescript 2.9.1TypeScript definition for StoreEnhancer prevents rest parametersWhy am I not getting the exported Object when importing in another Typescript project?Webpack build is throwing “.sourceMap is an alias for .sourceMaps, cannot use both”
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
Recently, we released a new version of an react app, but caused the IE11
complain the let
keyword.
When I looked into, I found it was because we upgraded query-string
package from 5.1.0
to 6.4.0
, and the new code used the let
keyword like here. And it looks like our build process didn't compile the imported packages from es6
to es5
.
We are using typescript
with babel 7
and webpack 4
, it all good for our own code and most packages except query-string
.
The following are our configs, please suggest the best way to solve it.
webpeck.config:
test: /.(t
tsconfig.json:
"compilerOptions":
"target": "esnext",
"module": "esnext",
"allowJs": true,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"lib": ["webworker", "esnext", "dom"],
"sourceMap": true,
"baseUrl": ".",
"paths":
"*": ["./src/*"]
,
"jsx": "preserve",
"strict": true,
"moduleResolution": "node",
"esModuleInterop": true
,
"include": ["./src/**/*", "./**/*.d.ts"],
"exclude": ["node_modules"]
.babelrc
const presets = [
'@babel/preset-typescript',
'@babel/preset-react',
[
'@babel/preset-env',
targets:
// React parses on ie 9, so we should too
ie: 9
,
forceAllTransforms: true,
// Disable polyfill transforms
useBuiltIns: false,
// Do not transform modules to CJS
modules: false
]
]
sample source file
import queryStringLib from 'query-string'
queryStringLib.stringify(...)
By the way, I have tried to remove exlcude node_modules
in both webpack.config
and tsconfig.json
, doesn't work. I also tried to change tsconfig.json
to target es5
, doesn't work either.
Update #1
I just tried, It will work, if I remove exclude node_modules
in both webpack.config
and tsconfig.json
, and change tsconfig.json
to target es5
. However it will make the computer a lot busier than before. Not a perfect solution.
Thanks,
Ron
typescript webpack babeljs
add a comment
|
Recently, we released a new version of an react app, but caused the IE11
complain the let
keyword.
When I looked into, I found it was because we upgraded query-string
package from 5.1.0
to 6.4.0
, and the new code used the let
keyword like here. And it looks like our build process didn't compile the imported packages from es6
to es5
.
We are using typescript
with babel 7
and webpack 4
, it all good for our own code and most packages except query-string
.
The following are our configs, please suggest the best way to solve it.
webpeck.config:
test: /.(t
tsconfig.json:
"compilerOptions":
"target": "esnext",
"module": "esnext",
"allowJs": true,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"lib": ["webworker", "esnext", "dom"],
"sourceMap": true,
"baseUrl": ".",
"paths":
"*": ["./src/*"]
,
"jsx": "preserve",
"strict": true,
"moduleResolution": "node",
"esModuleInterop": true
,
"include": ["./src/**/*", "./**/*.d.ts"],
"exclude": ["node_modules"]
.babelrc
const presets = [
'@babel/preset-typescript',
'@babel/preset-react',
[
'@babel/preset-env',
targets:
// React parses on ie 9, so we should too
ie: 9
,
forceAllTransforms: true,
// Disable polyfill transforms
useBuiltIns: false,
// Do not transform modules to CJS
modules: false
]
]
sample source file
import queryStringLib from 'query-string'
queryStringLib.stringify(...)
By the way, I have tried to remove exlcude node_modules
in both webpack.config
and tsconfig.json
, doesn't work. I also tried to change tsconfig.json
to target es5
, doesn't work either.
Update #1
I just tried, It will work, if I remove exclude node_modules
in both webpack.config
and tsconfig.json
, and change tsconfig.json
to target es5
. However it will make the computer a lot busier than before. Not a perfect solution.
Thanks,
Ron
typescript webpack babeljs
add a comment
|
Recently, we released a new version of an react app, but caused the IE11
complain the let
keyword.
When I looked into, I found it was because we upgraded query-string
package from 5.1.0
to 6.4.0
, and the new code used the let
keyword like here. And it looks like our build process didn't compile the imported packages from es6
to es5
.
We are using typescript
with babel 7
and webpack 4
, it all good for our own code and most packages except query-string
.
The following are our configs, please suggest the best way to solve it.
webpeck.config:
test: /.(t
tsconfig.json:
"compilerOptions":
"target": "esnext",
"module": "esnext",
"allowJs": true,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"lib": ["webworker", "esnext", "dom"],
"sourceMap": true,
"baseUrl": ".",
"paths":
"*": ["./src/*"]
,
"jsx": "preserve",
"strict": true,
"moduleResolution": "node",
"esModuleInterop": true
,
"include": ["./src/**/*", "./**/*.d.ts"],
"exclude": ["node_modules"]
.babelrc
const presets = [
'@babel/preset-typescript',
'@babel/preset-react',
[
'@babel/preset-env',
targets:
// React parses on ie 9, so we should too
ie: 9
,
forceAllTransforms: true,
// Disable polyfill transforms
useBuiltIns: false,
// Do not transform modules to CJS
modules: false
]
]
sample source file
import queryStringLib from 'query-string'
queryStringLib.stringify(...)
By the way, I have tried to remove exlcude node_modules
in both webpack.config
and tsconfig.json
, doesn't work. I also tried to change tsconfig.json
to target es5
, doesn't work either.
Update #1
I just tried, It will work, if I remove exclude node_modules
in both webpack.config
and tsconfig.json
, and change tsconfig.json
to target es5
. However it will make the computer a lot busier than before. Not a perfect solution.
Thanks,
Ron
typescript webpack babeljs
Recently, we released a new version of an react app, but caused the IE11
complain the let
keyword.
When I looked into, I found it was because we upgraded query-string
package from 5.1.0
to 6.4.0
, and the new code used the let
keyword like here. And it looks like our build process didn't compile the imported packages from es6
to es5
.
We are using typescript
with babel 7
and webpack 4
, it all good for our own code and most packages except query-string
.
The following are our configs, please suggest the best way to solve it.
webpeck.config:
test: /.(t
tsconfig.json:
"compilerOptions":
"target": "esnext",
"module": "esnext",
"allowJs": true,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"lib": ["webworker", "esnext", "dom"],
"sourceMap": true,
"baseUrl": ".",
"paths":
"*": ["./src/*"]
,
"jsx": "preserve",
"strict": true,
"moduleResolution": "node",
"esModuleInterop": true
,
"include": ["./src/**/*", "./**/*.d.ts"],
"exclude": ["node_modules"]
.babelrc
const presets = [
'@babel/preset-typescript',
'@babel/preset-react',
[
'@babel/preset-env',
targets:
// React parses on ie 9, so we should too
ie: 9
,
forceAllTransforms: true,
// Disable polyfill transforms
useBuiltIns: false,
// Do not transform modules to CJS
modules: false
]
]
sample source file
import queryStringLib from 'query-string'
queryStringLib.stringify(...)
By the way, I have tried to remove exlcude node_modules
in both webpack.config
and tsconfig.json
, doesn't work. I also tried to change tsconfig.json
to target es5
, doesn't work either.
Update #1
I just tried, It will work, if I remove exclude node_modules
in both webpack.config
and tsconfig.json
, and change tsconfig.json
to target es5
. However it will make the computer a lot busier than before. Not a perfect solution.
Thanks,
Ron
typescript webpack babeljs
typescript webpack babeljs
edited Mar 28 at 13:30
Ron
asked Mar 28 at 12:01
RonRon
1,7981 gold badge15 silver badges32 bronze badges
1,7981 gold badge15 silver badges32 bronze badges
add a comment
|
add a comment
|
1 Answer
1
active
oldest
votes
To me, it worked if I changed webpack.config to:
j)sx?$/,
exclude: /node_modules(?!(/
In other words, exclude all other node_modules except query-string
and add @babel/preset-env
as a preset option to babel-loader
(babel-loader
did not work correctly without).
No changes to tsconfig.json
.
add a comment
|
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/4.0/"u003ecc by-sa 4.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%2f55397134%2fhow-build-typescript-with-imported-packages-properly-for-ie11-using-bable-7-and%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
To me, it worked if I changed webpack.config to:
j)sx?$/,
exclude: /node_modules(?!(/
In other words, exclude all other node_modules except query-string
and add @babel/preset-env
as a preset option to babel-loader
(babel-loader
did not work correctly without).
No changes to tsconfig.json
.
add a comment
|
To me, it worked if I changed webpack.config to:
j)sx?$/,
exclude: /node_modules(?!(/
In other words, exclude all other node_modules except query-string
and add @babel/preset-env
as a preset option to babel-loader
(babel-loader
did not work correctly without).
No changes to tsconfig.json
.
add a comment
|
To me, it worked if I changed webpack.config to:
j)sx?$/,
exclude: /node_modules(?!(/
In other words, exclude all other node_modules except query-string
and add @babel/preset-env
as a preset option to babel-loader
(babel-loader
did not work correctly without).
No changes to tsconfig.json
.
To me, it worked if I changed webpack.config to:
j)sx?$/,
exclude: /node_modules(?!(/
In other words, exclude all other node_modules except query-string
and add @babel/preset-env
as a preset option to babel-loader
(babel-loader
did not work correctly without).
No changes to tsconfig.json
.
answered Mar 29 at 15:25
masamasa
2,1833 gold badges14 silver badges24 bronze badges
2,1833 gold badges14 silver badges24 bronze badges
add a comment
|
add a comment
|
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.
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.
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%2f55397134%2fhow-build-typescript-with-imported-packages-properly-for-ie11-using-bable-7-and%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