.babelrc在npm install时会被改变

Question

在一个老项目中,如果执行npm install或者yarn命令,有时会导致.babelrc产生变化.

具体变化如下:
由

{
  "presets": [
    [
      "env",
      {
        "modules": false,
        "targets": {
          "browsers": [
            "> 1%",
            "last 2 versions",
            "not ie <= 8"
          ]
        }
      }
    ],
    "stage-2"
  ],
  "plugins": [
    "syntax-dynamic-import",
    "transform-vue-jsx",
    "transform-runtime",
    [
      "import",
      {
        "libraryName": "vant",
        "libraryDirectory": "es",
        "style": true
      }
    ]
  ]
}

变成

{
  "presets": [
    "env",
    "react",
    "stage-0"
  ],
  "plugins": [
    "transform-class-properties",
    "transform-decorators",
    "transform-react-constant-elements",
    "transform-react-inline-elements"
  ]
}

项目中甚至都没有用到react.依赖如下

 "@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
    "autoprefixer": "^7.1.3",
    "babel-core": "^6.25.0",
    "babel-env": "^2.4.1",
    "babel-loader": "^7.1.2",
    "babel-plugin-import": "^1.8.0",
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "babel-plugin-transform-regenerator": "^6.26.0",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-plugin-transform-vue-jsx": "^3.5.0",
    "babel-preset-env": "^1.6.1",
    "babel-preset-es2015": "^6.24.1",
    "browserify": "^14.1.0",
    "clean-webpack-plugin": "^0.1.17",
    "connect-history-api-fallback": "^1.4.0",
    "css-loader": "^0.28.6",
    "eruda": "^1.4.1",
    "express": "^4.16.2",
    "external": "^1.0.0",
    "extract-text-webpack-plugin": "^3.0.2",
    "file-loader": "^1.1.5",
    "gulp": "^3.9.1",
    "gulp-autoprefixer": "^4.0.0",
    "gulp-babel": "^7.0.0",
    "gulp-base64": "^0.1.3",
    "gulp-bom": "^1.0.0",
    "gulp-concat": "^2.6.1",
    "gulp-connect": "^5.0.0",
    "gulp-cssmin": "^0.2.0",
    "gulp-eslint": "^4.0.0",
    "gulp-less": "^3.3.2",
    "gulp-postcss": "^7.0.0",
    "gulp-rev": "^7.1.2",
    "gulp-rev-collector": "^1.1.1",
    "gulp-uglify": "^2.0.1",
    "gulp-util": "^3.0.8",
    "html-webpack-plugin": "^2.30.1",
    "http-proxy-middleware": "^0.17.4",
    "less-loader": "^4.0.5",
    "lodash.assign": "^4.2.0",
    "opn": "^5.1.0",
    "postcss-loader": "^2.0.7",
    "postcss-px2rem": "^0.3.0",
    "px2rem-loader": "^0.1.7",
    "require-dir": "^0.3.1",
    "run-sequence": "^1.2.2",
    "style-loader": "^0.18.2",
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.1",
    "svg-sprite-loader": "^3.8.0",
    "url-loader": "^0.6.2",
    "vconsole": "^2.5.2",
    "vinyl-buffer": "^1.0.0",
    "vinyl-source-stream": "^1.1.0",
    "vue-loader": "^13.3.0",
    "vue-template-compiler": "^2.4.4",
    "watchify": "^3.9.0",
    "webpack": "^3.7.1",
    "webpack-dev-middleware": "^1.12.0",
    "webpack-dev-server": "^2.9.1",
    "webpack-hot-middleware": "^2.19.1",
    "webpack-utf8-bom": "^1.1.3"

因为是老项目,所以很多依赖实际上已经过时了.但是没有删除(老项目你懂的).
所以可能是这里的一些依赖导致的.

这个问题不是必现的.如果删掉node_modules重新安装,无法重现.
经常出现在切换分支之后--但是检查过不是错误提交导致的.
package-lock.json与yarn.lock均删除过.也无法解决.
总是这样不定时的出现导致十分困惑.有人遇到过类似的问题吗.是如何解决的?

可能的原因

1. 旧依赖
2. git
3. lock文件

Answer 1

其实是你的依赖package.json混入了 babel-env 这个库，他会将你 .babelrc 替换成他的模板文件。并且他是在 postinstall 钩子执行。所以每次下载都会被替换成这个。

https://github.com/epsitec-sa...

{

"presets": \[

"env",

"react",

"stage-0"

\],

"plugins": \[

"transform-class-properties",

"transform-decorators",

"transform-react-constant-elements",

"transform-react-inline-elements"

\]

}