babel

babel-preset-es2015がduprecateと言われたのでbabel_preset_envを使ってみたメモ

こんなwarnが出ていたので推奨通りにbabel_preset_envを使ってみました(コンソールでは文字化けしていましたが中々煽る感じの絵文字が含まれていたんですね)

npm WARN deprecated babel-preset-es2015@6.24.1: 🙌  Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update!

package.json 修正前

babel関係のpackageが5個あります。

その内babel-plugin-root-importはreactでcomponentをimportする際に絶対パスで書けるようにするためのものなので、恐らくbabel本体とは無関係のはず。

package.json
{
  "private": true,
  "scripts": {
    "dev": "next",
    "build": "next build",
    "start": "next start"
  },
  "devDependencies": {
    "babel-core": "^6.25.0",
    "babel-loader": "^7.0.0",
    "babel-plugin-root-import": "^5.1.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "create-next-app": "^0.5.2",
    "css-loader": "^0.28.4",
    "isomorphic-unfetch": "^2.0.0",
    "material-ui": "^0.18.6",
    "next": "^2.4.7",
    "react-redux": "^5.0.5",
    "react-tap-event-plugin": "^2.0.1",
    "redux": "^3.7.2",
    "redux-act": "^1.3.0",
    "style-loader": "^0.18.2",
    "webpack": "^2.6.1",
    "webpack-dev-server": "^2.5.0"
  },
  "dependencies": {
    "react": "^15.6.1",
    "react-dom": "^15.6.1"
  }
}

package.json修正後

当初の目的であるbabel-preset-es2015を含めた4つを削ることにしました。
一応起動は成功。

package.json
{
  "private": true,
  "scripts": {
    "dev": "next",
    "build": "next build",
    "start": "next start"
  },
  "devDependencies": {
    "babel-plugin-root-import": "^5.1.0",
    "babel-preset-env": "^1.6.1",
    "create-next-app": "^0.5.2",
    "css-loader": "^0.28.4",
    "isomorphic-unfetch": "^2.0.0",
    "material-ui": "^0.18.6",
    "next": "^2.4.7",
    "react-redux": "^5.0.5",
    "react-tap-event-plugin": "^2.0.1",
    "redux": "^3.7.2",
    "redux-act": "^1.3.0",
    "style-loader": "^0.18.2",
    "webpack": "^2.6.1",
    "webpack-dev-server": "^2.5.0"
  },
  "dependencies": {
    "react": "^15.6.1",
    "react-dom": "^15.6.1"
  }
}

まとめ

babelが何をやっているのか殆どわかっていませんしわかりたくもないのが本音です。。
parcelとか出てきたし、ますます混乱してきました。

  • babel関係はbabel_preset_env入れておけば良さげ