npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

vite-plugin-docker

v0.0.5

Published

This is a Vite.js plugin that facilitates integration with Docker for building and running containers.

Downloads

8

Readme

Docker Plugin for Vite.js

This is a Vite.js plugin that facilitates integration with Docker for building and running containers.

Motivation

The motivation behind using this plugin is to streamline the development environment by creating isolated standalone environments for each developer. This allows developers to work in a consistent and reproducible environment, minimizing potential conflicts and ensuring a smoother development experience.

Installation

npm install --save-dev plugin-docker

Usage

In your vite.config.js file, import the plugin and add it to the plugins section:

import { defineConfig } from "vite";
import pluginDocker from "plugin-docker";
export default defineConfig({
  plugins: [
    pluginDocker([
      // ...Docker configurations here
    ]),
  ],
});

Configuration

Attributes of PluginDockerOptions

| Attribute | Description | | ------------------- | ---------------------------------------------------------------------------------------------- | | name | Name of the Docker container. | | dockerfile | Path to the Dockerfile for building the image. | | enabled | (Optional) Enable or disable the plugin. Default value: true. | | profile | (Optional) Image build profile. | | imageTag | (Optional) Docker image tag. | | imageIncludes | (Optional) Files included in the Docker image. | | envPrefix | (Optional) Prefixes to be applied to environment variables during Docker container operations. | | envOverride | (Optional) Overrides for specific environment variables during Docker container operations. | | startActions | (Optional) Actions to perform when the dev/start project is initialized. | | buildStartActions | (Optional) Actions to perform when the build process is started. | | buildEndActions | (Optional) Actions to perform when the build process is completed. | | dockerOptions | (Optional) Additional Docker options. | | actionOptions | (Optional) Action options for customizing Docker actions. | | hotReload | (Optional) Enable or disable hot reload. Default value: false. |

Example 1

import { defineConfig } from "vite";
import pluginDocker from "plugin-docker";
export default defineConfig({
  plugins: [
    pluginDocker({
      name: "NGinx",
      dockerfile: "NGinx.Dockerfile",
      actionOptions: {
        onContainerCreateOptions: (opts) => {
          return {
            ...opts,
            ExposedPorts: { "80/tcp": {} },
            HostConfig: {
              PortBindings: { "80/tcp": [{ HostPort: "8080" }] },
            },
          };
        },
      },
      startActions: ["image:build", "container:create", "container:start"],
    }),
  ],
});

Example 2

import { defineConfig } from "vite";
import pluginDocker from "plugin-docker";
export default defineConfig({
  plugins: [
    pluginDocker({
      name: "MongoV1",
      imageTag: "mongo",
      actionOptions: {
        onContainerCreateOptions: (opts) => {
          return {
            ...opts,
            ExposedPorts: { "27017/tcp": {} },
            HostConfig: {
              PortBindings: { "27017/tcp": [{ HostPort: "27017" }] },
            },
          };
        },
      },
      startActions: ["container:create", "container:start"],
    }),
  ],
});

Example 3

import { defineConfig } from "vite";
import pluginDocker from "plugin-docker";
export default defineConfig({
  plugins: [
    pluginDocker([
      {
        // MONGO
      },
      {
        // NGINX
      },
      // Other containers...
    ]),
  ],
});