vue cli で作成したプロジェクトのbuildができない
2019/06/30 12時頃、vue create
で作成したプロジェクトのnpm run build
コマンドができなくなった。
以下のようなエラーが発生。
$ npm run build
⠙ Building for production...Starting type checking and linting service...
Using 1 worker with 2048MB memory limit
⠸ Building for production...Unhandled rejection Error: original.line and original.column are not numbers -- you probably meant to omit the original mapping entirely and only map the generated position. If so, pass null for the original mapping instead of an object with empty or null values.
at SourceMapGenerator_validateMapping [as _validateMapping] (/Users/user_name/spring-sec-sample-app/src/main/resources/client-app/node_modules/webpack-sources/node_modules/source-map/lib/source-map-generator.js:276:15)
...
エラーをみる限り、source map
の作成時にコケている?よう。
暫定対応1
そもそもビルド時に、source map
を作成しないようにする。
vueプロジェクトの設定は、vue.config.js
に書き込めば、vueがそのファイルを自動的に検知して読み込んでくれる。
デフォルトでは作成されないので、存在しない場合は自分で作成する。
階層はプロジェクトディレクトリのルートに配置する。
$ vi vue.config.js
module.exports = {
// other config
productionSourceMap: false
}
これでひとまず、エラーは回避できる。
暫定対応2
node modules の依存関係を自分で定義する。
{
"dependencies": {
"core-js": "^2.6.5",
"vue": "^2.6.10",
"vue-class-component": "^7.0.2",
"vue-property-decorator": "^8.1.0",
"vue-router": "^3.0.3",
"terser": "4.0.0" // 追加
},
}
上記のように、terser
のバージョンを4.0.0
に指定する。
原因
vueプロジェクトはsource map
作成時、内部的に依存しているterser
というライブラリを利用している。
そのterser
がv4.0.1を2019/06/30にリリースした模様。
そのv4.0.1でバグが紛れ込んだそうです。
issueが上がっていました。
https://github.com/terser-js/terser/issues/380
クライアントってモジュールの依存関係が複雑すぎて、こういう小さな変化がエラーを生み出すし、サーバに比べて極めて大変。。
依存する全てのモジュール理解している人とかいるのかな、、難しい。