LoginSignup
16
8

More than 5 years have passed since last update.

Nuxt.jsのcontext.isXXXの歴史

Posted at

contextの使い方と問題

Nuxt.jsはビルド時の拡張機能としてよく以下のように context.isDev context.isClient 等を使います
extendの第二引数がcontextオブジェクトとなっています

nuxt.config.js
module.exports = {
  build: {
     extend (config, { isDev, isClient }) {
       // ...
     }
  }
}

しかしながらこのような isDev , isClient 等はバージョンによって推奨、非推奨、使用不可など別になっており注意が必要なようです

バージョンごとのcontext

一部自分で試したものもありますが、リファレンスで読んだだけのものなどもあるので全ては確認していません。間違ってたらごめんなさい。指摘していただけるととても嬉しいです

v1.0.0未満

isDevは使えず、devを使うようです

判定するもの
開発環境 context.dev
サーバー context.isServer
クライアント context.isClient

v1.0.0以降

リリースノート確認したところv1.0.0において以下のようにかいてありました

For the below depreciation, it will still work but you will get a warning to tell you to change your code to the new value.

For better bundling experience for server-side and client-side, we deprecated context.isClient and context.isServer in flavor of process.client and process.server. Since these variables comes from our webpack configuration, it will optimize your client-side and server-side bundles magically :nail_care:

We also deprecated dev property inside build.extend() in flavour of isDev.

つまりこんな感じです

判定するもの 推奨 非推奨
開発環境 context.isDev context.dev
サーバー process.server context.isServer
クライアント process.client context.isClient

v1.4.0

現在のものです
v1.0.0と推奨、非推奨が逆になってるっぽいです

参考
https://nuxtjs.org/api/context/

判定するもの 推奨 非推奨
開発環境 context.isDev
サーバー context.isServer process.server
クライアント context.isClient process.client

v2(nuxt-edge)

まだ先行リリース段階ですが、また変わってたようです
isServer , isClient は廃止。バイバイありがとうさようなら
ちなみに options.devoptions.isDev になったようです

参考
Nuxt 2 is coming! Oh yeah!
【実録】Nuxt.jsの既存プロジェクトを一足早くNuxt v2( nuxt-edge )へとアップグレードする方法

判定するもの
開発環境 context.isDev
サーバー process.server
クライアント process.browser
16
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
16
8