Questions tagged [babel-loader]
718 questions
17
votes
3 answers
Yarn Workspaces and Invalid Hook call
Having a lot of trouble trying to set up a common UI library.
I've set up a yarn workspace which looks like this:
/monorepo
/common-16.13
/react-app-16.8.
/another-app-16.13
I then import common-16.13 into react-app-16.8 and use one of…
Batman
- 5,563
- 18
- 79
- 155
16
votes
2 answers
React - Add @babel/preset-react (https://git.io/JfeDR) to the 'presets' section of your Babel config to enable transformation
I want to use react-validation component Input in my form. This is why I imported it & used inside the form as:
Bishwajit Purkaystha
- 1,975
- 7
- 22
- 30
15
votes
2 answers
Whats the difference when configuring webpack babel-loader vs configuring it within package.json?
Hi please help me understand the differences between setting babel config inside .babelrc vs webpack loader options, vs inserting it in package.json.
For example, Would it make any difference if I put the presets in the webpack babel-loader options…
Bob
- 532
- 5
- 14
15
votes
4 answers
Unexpected token: operator (>) from UglifyJs
I have 2 Vue-Cli webpack projects (ClientApp and Lib).
Lib is my components library (shared with other projects)
Problem
When I build my project ClientApp npm run build, I have the following error:
ERROR in static/js/app.d08a24ce0e8d0438ce68.js from…
Zysce
- 1,200
- 1
- 10
- 35
14
votes
2 answers
Got error: Plugin/Preset files are not allowed to export objects, only functions
I got this error while setup my react app using the webpack and babel. I try to change the version of babel but still getting the same error. I'm not getting where's the problem.
ERROR in ./src/index.jsx
Module build failed (from…
Arslan Razzaq
- 193
- 1
- 1
- 10
14
votes
4 answers
Nuxt Error: Syntax Unexpected token export after installation
I am using Nuxt for my Vue project, It was working fine. I deleted my yarn and NPM cache due to other project issues. I re-installed the packages for my Nuxt app. The app is Universal and Uses express. Installation and Dev server is running, but…
saima dattuu
- 143
- 1
- 1
- 7
14
votes
1 answer
Transpiling Array.prototype.flat away with @babel?
I inadvertently introduced a backwards compatibility issue in my React app by using Array.prototype.flat. I was very surprised this didn't get resolved by transpiling - I thought this would result in es2015 compatible code.
How can I get Babel 7 to…
DerKastellan
- 143
- 2
- 7
13
votes
4 answers
react-dom blowing out webpack bundle size MASSIVELY
This has got to be one of the strangest issues with webpack i have ever come across...
Check out this bundle breakdown:
react 116.01KB - fair enough
react-dom 533.24KB - seriously WTF
I thought it may be a corruption in my dependencies but nuking…
Toby Flemming
- 501
- 1
- 4
- 15
12
votes
2 answers
Webpack Babel-loader transpiles code with eval()
I'm having an issue with Webpack and Babel. I'm trying transpile my JavaScript code into a bundle file. Here's the file structure and the snippets:
file structure:
- src
| file.js
package.json
webpack.config.js
package.json:
{
"name":…
Ivan
- 34,531
- 8
- 55
- 100
11
votes
4 answers
You may need an additional loader to handle the result of these loaders (upgrading Monaco Editor)
I wanted to upgrade the version of Monaco Editor to v0.31.1. I did npm install monaco-editor@0.31.1, and the recompilation by sudo PORT=8000 HTTPS=true ./node_modules/.bin/react-app-rewired start gave me the following error:
Failed to…
SoftTimur
- 5,630
- 38
- 140
- 292
11
votes
1 answer
Uncaught ReferenceError: regeneratorRuntime is not defined in react 17, webpack 5 while making api calls through actions
Having this error Uncaught ReferenceError: regeneratorRuntime is not defined when trying to make a api call using superagent.
Currently i am using react 17, webpack 5 along with css modules and all latest packages.
package.json
{
"dependencies":…
Sharath
- 2,348
- 8
- 45
- 81
11
votes
1 answer
Babel 7 + Inversify 4 + WebPack 4 - Unexpected character '@' on @inject
I have a typescript Vue SPA project where I use Inversify.
I used awesome-typescript-loader for compiling my typescript source code; now I want to switch to Babel but when I compile my application webpack raise this error:
Module parse failed:…
Max
- 6,821
- 3
- 43
- 59
11
votes
2 answers
Using Webpack To Transpile ES6 as separate files
Is it possible to configure webpack to do the equivalent of:
babel src --watch --out-dir lib
So that a directory structure that looks like this:
- src
- alpha
- beta.js
- charlie
- delta.js
- echo.js
- foxtrot
- golf
…
Undistraction
- 42,754
- 56
- 195
- 331
10
votes
0 answers
How to export/ import ESM/ ES6 Module Properly in ESM aware Chrome
I have an app that I'm bundling with Webpack 4 and Babel loader.
In the main entry point I'm exporting a class, for example export default Test; Now I'm trying to import the main bundle in an ESM aware Chrome via