【npm-script】package.json内で変数を使用する【windows10】

はじめに
やりたいこと
解決策
おわりに

はじめに

package.json の“scripts”内では変数を使用することができます。

変数の記述方法についてはたくさんの記事で紹介されていたのですが、windowsとそれ以外ではその記述方法が異なります。

記述方法の違いに気づかずつまづいたので、windowsを使っている方で package.json 内で変数の使用が出来ずに悩んでいる方は参考にしてください。

対象者

package.json内で変数の使用が出来ずに悩んでいる方
windowsの方

それでは説明に移ります。

やりたいこと

以下のようにpakcage.jsonの“scripts”で実行するコマンド“aaa”を用意しました。

{
	"name": "test",
	"version": "1.0.0",
	"description": "",
	"main": "index.js",

	"scripts": {
		"aaa": "echo テストですよ"
	},

	"keywords": [],
	"author": "",
	"license": "ISC"
}

“aaa”のコマンドを実行すると当然以下のように”テストですよ”が出力されます。

PS C:\Users\shuuk\OneDrive\デスクトップ\test> npm run aaa

> test@1.0.0 aaa C:\Users\shuuk\OneDrive\デスクトップ\test
> echo テストですよ

テストですよ

こちらの出力される文字列を変数を使って切り替えていきましょう。

解決策

使用したい変数を“config”内に記述します。

{
	"name": "test",
	"version": "1.0.0",
	"description": "",
	"main": "index.js",

	"config": {
		"cmd": "テストですよ"
	},

	"scripts": {
    // いったん削除
		// "aaa": "echo テストですよ"
	},

	"keywords": [],
	"author": "",
	"license": "ISC"
}

“config”内の値は以下のような記述で使用することができるようになります。

// windowsの場合
%npm_package_config_xxx%

// それ以外の場合
$npm_package_config_xxx

windowsとそれ以外では変数の記述方法が大きく異なります。

記述方法を間違えると正しく動作しないので注意が必要です。

それでは“scripts”のコマンドを変数に置き換えていきましょう。

{
	"name": "test",
	"version": "1.0.0",
	"description": "",
	"main": "index.js",

	"config": {
		"cmd": "テストですよ"
	},

	"scripts": {
		"aaa": "echo %npm_package_config_cmd%"
	},

	"keywords": [],
	"author": "",
	"license": "ISC"
}

以下のように同じ出力結果が得られれば正しく動作しています。

PS C:\Users\shuuk\OneDrive\デスクトップ\test> npm run aaa

> test@1.0.0 aaa C:\Users\shuuk\OneDrive\デスクトップ\test
> echo %npm_package_config_cmd%

テストですよ
PS C:\Users\shuuk\OneDrive\デスクトップ\test>