이 코드가 있습니다.

"use strict";

import browserSync from "browser-sync";
import httpProxy from "http-proxy";

let proxy = httpProxy.createProxyServer({});

내가 설치 babel-core및 babel-cli세계적으로 NPM을 통해. 요점은 터미널에서 이것을 컴파일하려고 할 때입니다.

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

출력 파일은 컴파일되는 대신 복사됩니다 (즉, 소스 파일과 동일 함).

내가 여기서 무엇을 놓치고 있습니까?

Babel은 변환 프레임 워크입니다. 6.x 이전 버전에서는 기본적으로 특정 변환을 활성화했지만 기본적으로 많은 ES6 기능을 지원하는 Node 버전의 사용이 증가함에 따라 구성 가능한 것이 훨씬 더 중요해졌습니다. 기본적으로 Babel 6.x는 변환을 수행하지 않습니다. 실행할 변환을 지정해야합니다.

npm install babel-preset-env

그리고 실행

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

또는 다음을 .babelrc포함 하는 파일을 만듭니다.

{
    "presets": [
        "env"
    ]
}

이전처럼 실행하십시오.

env이 경우 기본적으로 모든 표준 ES * 동작을 ES5로 컴파일하라는 사전 설정입니다. 일부 ES6를 지원하는 Node 버전을 사용하는 경우 다음 작업을 고려할 수 있습니다.

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

노드 버전에서 지원하지 않는 항목 만 처리하도록 사전 설정에 지시합니다. 브라우저 지원이 필요한 경우 대상에 브라우저 버전을 포함 할 수도 있습니다.

이 답변의 대부분은 구식입니다. @babel/preset-env그리고 "@babel/preset-react당신은 (7 월 2019로) 필요합니다.

다른 원인으로 동일한 문제가 발생했습니다.

로드하려는 코드는 패키지 디렉토리 아래에 있지 않으며 Babel은 기본적으로 패키지 디렉토리 외부에서 트랜스 파일하지 않습니다.

가져온 코드를 이동하여 문제를 해결했지만 아마도 Babel 구성에 포함 문을 사용할 수도있었습니다.

먼저 다음이 있는지 확인하십시오 node modules.

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

다음으로 Webpack 구성 파일 ( webpack.config.js)에 다음을 추가합니다 .

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

참조 :

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

행운을 빕니다!

현재 2020, Jan:

1 단계 : 다음을 설치합니다 Babel presets.

yarn add -D @babel/preset-env @babel/preset-react

2 단계 : 파일 생성 : 다음 babelrc.js을 추가합니다 presets.

module.exports = {
  // ...
  presets: ["@babel/preset-env", "@babel/preset-react"],
  // ...
}

3 단계 :-설치 babel-loader:

yarn add -D babel-loader

4 단계 :-다음 위치에 로더 구성 추가 webpack.config.js:

{
//...
  module: [
    rules: [
      test: /\.(js|mjs|jsx|ts|tsx)$/,
      loader: require.resolve('babel-loader')
    ]
  ]
//...
}

행운을 빕니다...

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

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

... .babelrc사전 설정으로 를 생성합니다 .

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

... 바벨 3.8.6및 노드를 사용 하여 저에게 매우 유사한 문제를 해결했습니다.v5.10.1

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

동일한 오류, 다른 원인 :

트랜스 파일링은 이전에 작동했지만 갑자기 작동이 중지되었으며 파일은 그대로 복사됩니다.

내가 .babelrc어느 시점에서 열었고 Windows는 .txt파일 이름 에 추가 하기 로 결정했습니다 . 이제 그것은 .babelrc.txt바벨에 의해 인식되지 않았습니다. .txt접미사를 제거하면 수정되었습니다.

.babelrc 수정

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

2018 년 :

아직 설치하지 않은 경우 다음 패키지를 설치하십시오.

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!
        }
      }
    ],
  }

궁극적 인 솔루션

나는 이것에 3 일을 낭비했다

import react from 'react' unexpected identifier

나는 수정 webpack.config.js및 package.json파일을 시도하고을 .babelrc통해 패키지를 추가 , 설치 및 업데이트 하려고 시도했지만 npm많은 페이지를 방문했지만 아무것도 작동하지 않았습니다.

무엇이 효과가 있었습니까? 두 단어 : npm start. 맞습니다.

실행

npm start 

터미널 에서 로컬 서버를 시작하는 명령

...

(즉시 작동하지 않을 수도 있지만 아마도 npm에서 작업을 한 후에야 할 수 있습니다.이 작업을 시도하기 전에 해당 파일의 모든 변경 사항을 삭제했고 작동했기 때문에 실제로 수행 한 후에는 마지막으로 처리하십시오. 리조트 )

이 깔끔한 페이지 에서 그 정보를 찾았습니다 . 폴란드어로되어 있지만 자유롭게 Google 번역을 사용하세요.