1

Some updates to a dependency of one of our dependencies broke our build and was a bit tricky to find out what the cause of the issue was...

We finally noticed that @vue/component-compiler-utils requires "prettier": "^1.11.1" and - as discussed in vue webpack template missing parser that Prettier@1.13.0 causes the issue we were having, before rolling back to Prettier@1.12.0

How do we ensure that package-lock.json "locks" dependencies to a version and do not update over time or when re-installed?

This is an example of our package.json from which the incorrect lock file is generated:

{
  ...
  "dependencies": {
    "html-loader": "0.5.1",
    "vue": "2.5.16",
    "vue-class-component": "6.2.0",
    "vue-property-decorator": "6.1.0",
    "vue-router": "3.0.1",
    "vuex": "3.0.1",
    "vuex-class": "0.3.0",
    ...
  },
  "devDependencies": {
    "@types/jest": "22.0.1",
    "@vue/cli-plugin-babel": "3.0.0-beta.11",
    "@vue/cli-plugin-eslint": "3.0.0-beta.11",
    "@vue/cli-plugin-typescript": "3.0.0-beta.11",
    "@vue/cli-plugin-unit-jest": "3.0.0-beta.7",
    "@vue/cli-service": "3.0.0-beta.11",
    "@vue/eslint-config-airbnb": "3.0.0-beta.11",
    "@vue/eslint-config-typescript": "3.0.0-beta.11",
    ...
  }
}
Andrea Epifani
  • 111
  • 1
  • 8

2 Answers2

1

Using npm shrinkwrap fixes the issue, it converts package-lock.json to a npm-shrinkwrap.json which hashes and locks every specific version installed.

See What is the difference between npm-shrinkwrap.json and package-lock.json? for more details

Andrea Epifani
  • 111
  • 1
  • 8
1

I'm not entirely sure if npm shrinkwrap fixes the issue in npm v6+.

Here is a snippet of the npm-shrinkwrap.json file that is being generated for vue-loader.

It seems as though even the shrinkwrap is not locking down the requires versions.

"vue-loader": {
  "version": "14.0.3",
  "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-14.0.3.tgz",
  "integrity": "sha512-5kFK/df1jgVoFcTB9p19rrYcyuYduoZzUSf6chMVsIRmVL9AKPYCa9JGLAZsU1XXGbGO9MSkwbum91u2dx7YcQ==",
  "dev": true,
  "requires": {
    "consolidate": "^0.14.0",
    "hash-sum": "^1.0.2",
    "loader-utils": "^1.1.0",
    "lru-cache": "^4.1.1",
    "postcss": "^6.0.8",
    "postcss-load-config": "^1.1.0",
    "postcss-selector-parser": "^2.0.0",
    "prettier": "^1.7.0",
    "resolve": "^1.4.0",
    "source-map": "^0.6.1",
    "vue-hot-reload-api": "^2.2.0",
    "vue-style-loader": "^4.0.1",
    "vue-template-es2015-compiler": "^1.6.0"
  }
grogg
  • 11
  • 3
  • We ended up switching to Yarn, their lock file is actually a "lock" file. If you run install as `yarn install --pure-lockfile` it'll install the versions specified in `yarn.lock`. – Andrea Epifani Jun 03 '18 at 01:41