초보자가 웹 스타터 키트를 사용하려고 했던 것을 공유하고 싶습니다.

이제 React를 알고 공부를 시작해 3개월째의 초보자입니다.
언제나처럼 여유 시간에 구구하고 있으면 "web-starter-kit"라는 구글 제의 편지지가 있다는 것을 알았습니다.
절대적인 구글 추종자의 저는 하나님 (구글)이 권고하는 것을 사용하지 않을 것입니다.
Google과 같은 사이트 에는 누구라도 간단하게 할 수 있게 써 있기 때문에 즉각 핥아 걸렸습니다.
그러나 실제로 해보면. . . .
$ gulp serve

이 커맨드가 움직일 때까지 에러 투성이로 굉장히 힘들었습니다.
비슷한 Google 신자가 같은 함정에 끼지 않도록 도움을 주시면 감사하겠습니다.

환경




도구 및 환경
     버전    


OS
Windows10

Node.js
 v11.15.0 ☚대사

web-starter-kit
v0.6.5


결론



기본 패키지를 다음으로 다시 작성하면 마침내 작동했습니다.

.babelrc 다시 쓰기

{
-  "presets": ["es2015"],
-  // Remove the line below to enable ES2015 support.
-  "only": "gulpfile.babel.js",
-  "retainLines": true
+  "presets": ["@babel/preset-env"]
}


package.json 다시 쓰기
{
  "devDependencies": {
-    "babel-core": "^6.14.0",
+    "@babel/core": "^7.9.0",
-    "babel-preset-es2015": "^6.0.15",
+    "@babel/preset-env": "^7.9.0",
+    "@babel/register": "^7.9.0",
+    "babel-jest": "^25.2.3",
+    "babel-loader": "^8.1.0",
+    "jest": "^25.2.3",
+    "node-sass": "^4.13.1",
+    "regenerator-runtime": "^0.13.5",
+    "sass": "^1.26.3"
   },
+  "resolutions": {
+    "babel-core": "7.0.0-bridge.0"
+  },
}


오류와 같은 일



Uncaught SyntaxError: Cannot use import statement outside a module

먼저 gulp 명령을 실행하고 gulp.babel.js를로드 할 때 발생한 오류입니다.
위와 같이 .babelrc를 다시 쓰면 해결되었습니다.
이유는 알 수 없습니다
아마 babel7.0에서 바베 하면 나올 것이라고 해석했을 것입니다.
자세한 분, 보충하실 수 있으면 눈물 나옵니다

참조 기사 : babel-preset-es2015 -> babel-preset-env


AssertionError [ERR_ASSERTION]: Task function must be specified

Node.js와 gulp이 버전에 따라 궁합이 나쁜 것 같고 그 때문에 나온 것 같습니다.
처음에는 gulp를 4.0으로 올려 보았지만 다른 오류가 웃어서 결국 Node.js 버전을 낮췄습니다.
에러와 대책의 상세한 것은 참조 기사로 정리해 주시고 있으므로, 그쪽을 봐 주세요

참조 기사:Gulp 환경 구축에서 「AssertionError [ERR_ASSERTION]: Task function must be specified」의 원인은 gulp v4로 버전 업한 것에 의한 사양 변경


Requires Babel “7.0.0-0” but was loaded with “6.26.3”

어쨌든 빠졌습니다.
종속성이 나쁜 것 같습니다.
다음 대책으로 마침내 대처할 수있었습니다.
  • 「babel-***」라고 되어 있는 바베루 관계의 패키지를 「@babel/***」(으)로 바꾸어 가는(글로벌도 하고 버리면 그쪽도)
  • package.json에 "resolutions"를 더한다
  • 기타 약간 더하기(위의 package.json에 더한 것)
  • 이쪽도 의미는 이해하고 있지 않습니다


  • 참조 기사:Requires Babel “7.0.0-0” but was loaded with “6.26.3” #8482

    요약



    위의 대책으로 겨우 명령 실행할 수 있었습니다.
    gulp라는 단어를 처음 들었을 정도의 초보자가 한 일이므로, 잘못된 일이나 쓸데없는 일도 있을까 생각합니다.
    정정하겠습니다 때문에, 눈치채신 분 지적 받을 수 있으면 다행입니다.
    끝까지 읽어 주셔서 감사합니다.

    좋은 웹페이지 즐겨찾기