framework info

重要な通知

このリポジトリは、github.com/netlify/buildのモノリポジトリに移動されました。パッケージ名とバージョンは保持されます！

フレームワーク検出ユーティリティ。

特定のWebサイトが使用しているフレームワークを検出します。フレームワークのビルド/開発コマンド、ディレクトリ、サーバーポートも返されます。

次のフレームワークが検出されます。

• 静的サイトジェネレーター：Gatsby、Hugo、Jekyll、Next.JS、Nuxt、Hexo、Gridsome、Docusaurus、Locusaurus、Middleman、Phenomic、React-Static、Stencil、Vuepress、Assemble、Docpad、Harp、Metalsmith、Roots、Wintersmiths
• フロントエンドフレームワーク：Create-React-App、Vue、Sapper、Angular、Ember、Svelte、Expo、Quasar
• ビルドツール：小包、ブランチ、グラント、ガープ

CLIを介してframework-infoを実行する方法を探している場合は、 build-infoプロジェクトを確認してください。

追加と更新は大歓迎です！

例（node.js）

 import { listFrameworks , hasFramework , getFramework } from '@netlify/framework-info'

console . log ( await listFrameworks ( { projectDir : './path/to/gatsby/website' } ) )
// [
//   {
//     id: 'gatsby',
//     name: 'Gatsby',
//     category: 'static_site_generator',
//     dev: {
//       commands: ['gatsby develop'],
//       port: 8000,
//       pollingStrategies: [{ name: 'TCP' }, { name: 'HTTP' }]
//     },
//     build: {
//       commands: ['gatsby build'],
//       directory: 'public'
//     },
//     staticAssetsDirectory: "static",
//     env: { GATSBY_LOGGER: 'yurnalist' },
//     plugins: []
//   }
// ]

console . log ( await listFrameworks ( { projectDir : './path/to/vue/website' } ) )
// [
//   {
//     id: 'vue',
//     name: 'Vue.js',
//     category: 'frontend_framework',
//     dev: {
//       commands: ['npm run serve'],
//       port: 8080,
//       pollingStrategies: [{ name: 'TCP' }, { name: 'HTTP' }]
//     },
//     build: {
//       commands: ['vue-cli-service build'],
//       directory: 'dist'
//     },
//     env: {},
//     plugins: []
//   }
// ]

console . log ( await hasFramework ( 'vue' , { projectDir : './path/to/vue/website' } ) )
// true

console . log ( await getFramework ( 'vue' , { projectDir : './path/to/vue/website' } ) )
// {
//   id: 'vue',
//   name: 'Vue.js',
//   category: 'frontend_framework',
//   dev: {
//     commands: ['npm run serve'],
//     port: 8080,
//     pollingStrategies: [{ name: 'TCP' }, { name: 'HTTP' }]
//   },
//   build: {
//     commands: ['vue-cli-service build'],
//     directory: 'dist'
//   },
//   env: {},
//   plugins: []
// }

インストール

npm install @netlify/framework-info

使用法（node.js）

ListFrameWorks（オプション？）

options ： object?
戻り値： Promise<object[]>

オプション

ProjectDir

タイプ： string
デフォルト値： process.cwd()

ウェブサイトのディレクトリへのパス。

返品値

これにより、各フレームワークを説明するオブジェクトの配列に解決するPromiseが返されます。配列は空になり、単一のオブジェクトまたは複数のオブジェクトを含めることができます。

各オブジェクトには、次のプロパティがあります。

id

タイプ： string

"gatsby"などのID。

名前

タイプ： string

"Gatsby"などのフレームワーク名。

カテゴリ

タイプ： string

"static_site_generator" 、 "frontend_framework" 、 "build_tool"のカテゴリ。

開発者

タイプ： object

開発コマンドに関する情報。

コマンド

タイプ： string[]

開発コマンド。いくつかの選択肢があるかもしれません。

ポート

タイプ： number

サーバーポート。

PollingsTrategies

タイプ： object[]

DEVサーバーの準備が整っているかどうかを確認するときに使用するポーリング戦略。

建てる

タイプ： object

ビルドコマンドに関する情報。

コマンド

タイプ： string[]

コマンドを作成します。いくつかの選択肢があるかもしれません。

ディレクトリ

タイプ： string

ファイルが構築されているディレクトリへの相対パス。

staticassetsdirectory

タイプ： string

フレームワークが静的資産を保存するディレクトリ。 undefinedすることができます。

env

タイプ： object

DEVコマンドを呼び出すときに設定する必要がある環境変数。

プラグイン

タイプ： string[]

フレームワーク用にインストールするために、netlifyビルドプラグインを推奨するリスト。

hasframework（frameworkid、options？）

options ： object?
返品値： Promise<boolean>

listFramework()と同じ特定のフレームワークのみを除き、ブール値を返します。

getFrameWork（FrameWorkID、オプション？）

options ： object?
返品値： Promise<object>

Frameworkが検出される代わりに、フレームワークが引数として渡されることを除いて、 listFramework()と同じです。単一のフレームワークオブジェクトが返されます。

使用法（CLI）

$ framework-info [projectDirectory]

これにより、各フレームワークのIDが印刷されます。

既知の場合、 unknown印刷されています。

利用可能なフラグ：

• --long ：各フレームワークの詳細を示します。出力はJSONアレイになります。

フレームワークを追加または更新します

各フレームワークは/src/frameworks/ directoryのJSONファイルです。例えば：

{
  "id" : " gatsby " ,
  "name" : " Gatsby " ,
  "category" : " static_site_generator " ,
  "detect" : {
    "npmDependencies" : [ " gatsby " ],
    "excludedNpmDependencies" : [],
    "configFiles" : [ " gatsby-config.js " ]
  },
  "dev" : {
    "command" : " gatsby develop " ,
    "port" : 8000 ,
    "pollingStrategies" : [{ "name" : " TCP " }, { "name" : " HTTP " }]
  },
  "build" : {
    "command" : " gatsby build " ,
    "directory" : " public "
  },
  "staticAssetsDirectory" : " static " ,
  "env" : { "GATSBY_LOGGER" : " yurnalist " },
  "plugins" : []
}

すべてのプロパティが必要です。

id

タイプ： string

フレームワークのID。

名前

タイプ： string

フレームワークの名前。

カテゴリ

タイプ： string

"static_site_generator" 、 "frontend_framework"または"build_tool"の1つ。

検出する

タイプ： object

このフレームワークを検出するために使用される情報

npmdependencies

タイプ： string[]

フレームワークのNPMパッケージ。 package.json （ dependenciesまたはdevDependencies ）にこれらのパッケージのいずれかを含むプロジェクトは、フレームワークを使用していると見なされます。

空の場合、これは無視されます。

除外されたnpmdependencies

タイプ： string[]

npmDependenciesの逆。これらのパッケージのいずれかを使用しているプロジェクトがある場合、フレームワークを使用しているとは見なされません。

空の場合、これは無視されます。

configfiles

タイプ： string[]

フレームワークの構成ファイル。これらは、プロジェクトのディレクトリに関連するパスである必要があります。構成ファイルの1つを備えたプロジェクトは、フレームワークを使用していると見なされます。

空の場合、これは無視されます。

開発者

タイプ： object

開発コマンドを検出するパラメーター。

指示

タイプ： string

デフォルトの開発コマンド。

ポート

タイプ： number

ローカル開発サーバーポート。

PollingsTrategies

タイプ： object[]

DEVサーバーの準備が整っているかどうかを確認するときに使用するポーリング戦略。

建てる

タイプ： object

ビルドコマンドを検出するパラメーター。

指示

タイプ： string

デフォルトのビルドコマンド。

ディレクトリ

タイプ： string

ビルドファイルが書かれているディレクトリ。

staticassetsdirectory

タイプ： string

フレームワークがフレームワークに関連する静的資産を保存するディレクトリ。

env

タイプ： object

DEVコマンドを実行するときに設定する必要がある環境変数。

プラグイン

タイプ： object[]

Netlifyビルドプラグインのパッケージ名と条件のリスト。プラグインの条件が満たされている場合、フレームワークのプラグインのリストに返されます。

例えば

{
  "plugins" : [
    {
      "packageName" : " @netlify/plugin-nextjs " ,
      "condition" : { "minNodeVersion" : " 10.13.0 " }
    }
  ]
}