Skip to content
Advertisement

Tag: babeljs

Babel not transpiling arrow functions (Webpack)

When running webpack, and babel, the resulting bundle.js still contains arrow functions. This gives me a Syntax Error when running in Internet Explorer 10. I would like babel to replace the arrow functions with normal functions that IE can run. My package.json has the following devDependencies: My webpack.config.js looks like this: My .babelrc looks like this: To transpile, I run

Why does this JSX expression produce an odd result?

I was playing around with JSX when I found this oddity. Using the following JSX: Will produce the correct result: But I wanted to add double quotes around the quote, so I tried: Which, to my surprise, gave the correct output: I was expecting an output similar to this since it was a string literal: Why doesn’t it give me

Uncaught SyntaxError: Unexpected token import in reactjs app

I have a react app and Im trying to create a dynamic form using react-jsonschema-form, I have the below index.js file below is the .babelrc file and I’ve the webpack config like below package.json once I run the app I’m getting console error Uncaught SyntaxError: Unexpected token import in reactjs app Can anyone help to resolve this issue, since I’m

update array of object without mutation

I’m following a react tutorial but I’m lost. I don’t understand starting line 9. so I tried to make a little miarature https://jsbin.com/sifihocija/2/edit?js,console but failed to produce the result that the author did, what’s wrong? Answer Issue is in this line: const index = list.findIndex(item => item.id === updated.id) updated is an array, to access the id, you need to

nodemon watch directory for changes

I know how to do nodemon server.js but what if I want to do nodemon ./src I want restart node on any changes in the directory of src. When I do above and it say cannot find module babelpracsrc I am also doing in another command window : npm run scripts:watch The script is That runs the watch but I

React Bootstrap Components not displaying

I’m trying to test out the carousel but when I load the page it is blank. I installed react bootstrap with npm. The carousal code is from https://react-bootstrap.github.io/components.html#media-content. I looked at my web console and I don’t have any warnings or errors either. carousal.js index.js index.html Answer Found the solution. It is not Bootstrap related but rather how I was

Re-export default in ES 6 modules

In ES6, is it possible to shorten the following code. I have an App.js file and an index.js. index.js Something like this index.js Answer If you use proposal-export-default-from Babel plugin (which is a part of stage-1 preset), you’ll be able to re-export default using the following code: For more information see the ECMAScript proposal. Another way (without this plugin) is:

Using Node.js require vs. ES6 import/export

In a project I am collaborating on, we have two choices on which module system we can use: Importing modules using require, and exporting using module.exports and exports.foo. Importing modules using ES6 import, and exporting using ES6 export Are there any performance benefits to using one over the other? Is there anything else that we should know if we were

Advertisement