javascript - subir - El archivo Babel se copia sin ser transformado

manejo de archivos en javascript

Question

Tengo este codigo:

"use strict";
import browserSync from "browser-sync";
import httpProxy from "http-proxy";
let proxy = httpProxy.createProxyServer({});

y he instalado babel-core y babel-cli nivel mundial a través de npm. El punto es cuando trato de compilar esto en mi terminal:

babel proxy.js --out-file proxified.js

El archivo de salida se copia en lugar de compilarse (quiero decir, es lo mismo que el archivo fuente).

¿Que me estoy perdiendo aqui?

Answer 1

Babel es un marco de transformación. Antes de 6.x, permitía ciertas transformaciones de forma predeterminada, pero con el mayor uso de las versiones de Node que admiten de forma nativa muchas características de ES6, se ha vuelto mucho más importante que las cosas sean configurables. Por defecto, Babel 6.x no realiza ninguna transformación. Debe decirle qué transformaciones ejecutar:

npm install babel-preset-env

y correr

babel --presets env proxy.js --out-file proxified.js

o cree un archivo .babelrc que contenga

{
"presets": [
"env"
]
}

y ejecútalo como eras antes.

env en este caso es un preajuste que básicamente dice que compile todo el comportamiento estándar de ES * a ES5. Si está utilizando versiones de Nodo que admiten algunos ES6, puede considerar hacer

{
"presets": [
["env", { "targets": { "node": "true" } }],
]
}

para indicarle al preset que solo procese cosas que no son compatibles con su versión Node. También puede incluir versiones de navegador en sus objetivos si necesita soporte de navegador.

Answer 2

La mayoría de estas respuestas son obsoletas. @babel/preset-env y "@babel/preset-react son lo que necesita (a partir de julio de 2019).

Answer 3

Mismo error, causa diferente:

Transpiling había funcionado antes y de repente dejó de funcionar, simplemente copiando los archivos tal como están.

Resulta que abrí el .babelrc en algún momento y Windows decidió agregar .txt al nombre del archivo. Ahora que .babelrc.txt no fue reconocido por babel. La eliminación del sufijo .txt solucionó eso.

Answer 4

Primero asegúrese de tener los siguientes node modules :

npm i -D webpack babel-core babel-preset-es2015 babel-preset-stage-2 babel-loader

A continuación, agregue esto a su archivo de configuración de webpack.config.js ( webpack.config.js ):

// webpack.config.js
...
module : {
loaders : [
{
test : //.js$/,
loader : ''babel'',
exclude : /node_modules/,
options : {
presets : [ ''es2015'', ''stage-2'' ] // stage-2 if required
}
}
]
}
...

Referencias

• https://gist.github.com/Couto/6c6164c24ae031bff935
• https://github.com/babel/babel-loader/issues/214

¡Buena suerte!

Answer 5

Tuve el mismo problema con una causa diferente:

El código que estaba tratando de cargar no estaba en el directorio del paquete, y Babel no está predeterminado para transpilar fuera del directorio del paquete.

Lo resolví moviendo el código importado, pero quizás también podría haber usado alguna declaración de inclusión en la configuración de Babel.

Answer 6

arregla tu .babelrc

{
"presets": [
"react",
"ES2015"
]
}

Answer 7

En el año 2018:

Instale los siguientes paquetes si aún no lo ha hecho:

npm install babel-loader babel-preset-react

webpack.config.js

{
test: //.jsx?$/,
exclude: /node_modules/,
use: [
{
loader: ''babel-loader'',
options: {
presets: [''es2015'',''react''] // <--- !`react` must be part of presets!
}
}
],
}

Answer 8

Solución definitiva

Perdí 3 días en esto

import react from ''react'' unexpected identifier

Intenté modificar los archivos webpack.config.js y package.json , y .babelrc , .babelrc y actualicé los paquetes a través de npm , he visitado muchas, muchas páginas, pero nada ha funcionado.

Que funciono Dos palabras: npm start. Está bien.

corre el

npm start 

comando en la terminal para iniciar un servidor local

...

(tenga en cuenta que puede que no funcione de inmediato, pero tal vez solo después de hacer un trabajo en npm porque antes de probar esto había eliminado todos los cambios en esos archivos y funcionó, así que después de que haya terminado, trátelo como su último resort )

Encontré esa información en esta página ordenada . Está en polaco, pero no dudes en usar el traductor de Google.

Answer 9

npm install --save-dev babel-preset-node5
npm install --save-dev babel-preset-react

... y luego creando un .babelrc con los presets:

{
"presets": [
"node5",
"react"
]
}

... resolvió un problema muy similar para mí, con babel 3.8.6 y el nodo v5.10.1

https://www.npmjs.com/package/babel-preset-node5
https://www.npmjs.com/package/babel-preset-react