Skip to content

dalferth/vue-telescope-analyzer

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Vue Telescope Analyzer

CLI to analyze a website and detect Vue and its ecosystem ✨

This module is used by vuetelescope.com to detect Vue and its ecosystem on a website.

You can help the community discover new Vue websites by using the browser extension 💚

Installation

npm install -g vue-telescope-analyzer # Or yarn global add vue-telescope-analyzer

Usage

vta [url]

# Example
vta https://nuxt.com

render1585566509798

It supports multiple frameworks, UI libraries and Vue plugins.

Frameworks

To support a new Vue framework, please look at detectors/frameworks.json.

UI Libraries

To support a new UI library, please look at detectors/uis.json.

Vue Plugins

To support a new Vue plugin, please look at detectors/plugins.json.

Nuxt Info

When Nuxt is detected as a framework, it will also detect:

  • If the website is server-rendered (mode: 'universal')
  • If the website is static (nuxt generate)

See detectors/nuxt.meta.json for the detection.

It will also detect the Nuxt modules used, refer to detectors/nuxt.modules.json to support new Nuxt modules.

NPM Module

You can use vue-telescope-analyzer locally on your project:

npm install vue-telescope-analyzer # Or yarn add vue-telescope-analyzer

Then you can use the module in your project:

const analyze = require('vue-telescope-analyzer')

analyze('https://nuxt.com')
  .then(result => console.log(result))
  .catch(error => console.error(error))

Result:

{                                                                                                                17:48:21
  url: 'https://nuxt.com/',
  hostname: 'nuxt.com',
  domain: 'nuxt.com',
  meta: {
    language: 'en',
    title: 'Nuxt: The Intuitive Web Framework',
    description: 'Build your next Vue.js application with confidence using Nuxt. An open source framework under MIT license that makes web development simple and powerful.',
    siteName: '',
    isAdultContent: false
  },
  vueVersion: '3.2.45',
  hasSSR: true,
  isStatic: false,
  framework: {
    slug: 'nuxtjs',
    name: 'Nuxt',
    imgPath: '/framework/nuxt.svg',
    url: 'https://nuxt.com'
  },
  plugins: [
    {
      slug: 'vue-router',
      name: 'vue-router',
      imgPath: null,
      url: 'https://router.vuejs.org/'
    }
  ],
  ui: {
    slug: 'tailwind-css',
    name: 'Tailwind CSS',
    imgPath: '/ui/tailwind.svg',
    url: 'https://tailwindcss.com/'
  },
  frameworkModules: [
    {
      slug: 'nuxt-content',
      name: '@nuxt/content',
      imgPath: null,
      url: 'https://content.nuxtjs.org'
    },
    {
      slug: 'nuxtjs-algolia',
      name: '@nuxtjs/algolia',
      imgPath: null,
      url: 'https://algolia.nuxtjs.org'
    },
    {
      slug: 'nuxt-image',
      name: '@nuxt/image',
      imgPath: null,
      url: 'https://image.nuxtjs.org'
    }
  ],
  screenshot: '/var/folders/.../00b97a2040a9aeffc8d5c9d855d2643a.jpg'
}

Contributing

  1. Clone this repository
  2. Install dependencies using yarn install or npm install
  3. Update the code right inside src/ or detectors/
  4. Test it with ./bin/vta.js https://your-url-to-test
  5. If you add a new detector, please add the icon in icons/ (SVG cleaned with SVGOMG)

License

MIT License

About

Detect Vue technologies running on a website ✨

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 99.1%
  • HTML 0.9%