javascript - 호출 - react ecmascript




Babelify는 node_modules에서 모듈을 가져올 때 ParseError를 발생시킵니다. (2)

browserify.transform 필드의 package.json 에서 소스 변환 을 지정할 수 있습니다. package.json에서 소스 변환이 작동하는 방법에 대한 자세한 정보는 module-deps readme에서 확인할 수 있습니다.

출처 : https://github.com/substack/node-browserify#browserifytransform

( my_batman_project/node_modules/test_robin_module/package.json ) :

"browserify": {
  "transform": [
    "babelify"
  ]
},

browserify 는 구성을 읽고 지정한 변환을 자동으로 수행합니다.

저는 BabelifyBrowserify 와 함께 일하고 있습니다. 또한 노드 모듈 시스템에서 ES6 스타일 모듈 기능을 사용하고 있습니다.

내 모든 모듈을 node_modules/libs 넣고 node_modules/libs .

예를 들면 :

test.js node_modules/libs

export default () => {
  console.log('Hello');
};

main.js ( bundle.js 로 컴파일됩니다)

import test from 'libs/test';

test();

그 후 위의 코드를 bundle.js 로 컴파일했다.

browserify -t babelify main.js -o bundle.js

하지만 불행히도 나는 약간의 오류가있다 :

export default () => {
^

ParseError: 'import' and 'export' may appear only with 'sourceType: module'

디렉토리 구조 :

[test]
  `-- node_modules
  │ `-- libs
  │  `-- test.js
  `-- main.js

그러나 자신의 모듈이 node_modules 없을 때 :

[test]
  `-- libs
  │ `-- test.js
  `-- main.js

그럼, 잘 작동합니다. babelify 에서 node_modules 와 함께 ES6 스타일 모듈을 사용하려면 어떻게 node_modules 합니까?


이것이 Browserify 변환이 작동하는 방법이며 변환은 참조되는 모듈에서 직접 영향을줍니다.

node_modules의 모듈에 변환이 필요한 경우 해당 모듈에 package.json 을 추가하고 해당 모듈의 변환으로 babelify 를 추가해야합니다. 예

"browserify": {
  "transform": [
    "babelify"
  ]
},

babelifypackage.jsonbabelify 내부에서 해당 모듈 내의 모든 파일에 대해 babelify 변환을 실행하도록 babelify 합니다.

libs 를 node_modules의 폴더로 사용하는 것은 나쁜 생각 일 수 있습니다. 일반적으로이 폴더에는 실제로 독립 실행 형 모듈이 있습니다. 일반적으로 폴더를 가져 와서 다른 곳에서 재사용 할 수 없다면 node_modules에 없어야합니다.

최신 정보

최근에 릴리스 된 Babel v6의 경우 코드에서 수행 할 변형을 지정해야합니다. 이를 위해 Babel을 구성하기 위해 루트 디렉토리에 .babelrc 파일을 만드는 것이 좋습니다.

{
  "presets": ["es2015"]
}

npm install --save-dev babel-preset-es2015






babeljs