# vue-cli-plugin-express

> vue-cli 3 plugin to add an Express Api

Latest version **1.0.2** (published 2019-07-12) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-cli-plugin-express
pnpm add vue-cli-plugin-express
yarn add vue-cli-plugin-express
bun add vue-cli-plugin-express
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.2 |
| Published | 2019-07-12 |
| First published | 2018-10-06 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 9 |
| Unpacked size | 389.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 50 |
| Author | Mathieu TUDISCO |
| Maintainers | mathieutu |
| Keywords | vue, vue-cli, express, api |

## Links

- npm: https://www.npmjs.com/package/vue-cli-plugin-express
- Repository: https://github.com/mathieutu/vue-cli-plugin-express
- Homepage: https://github.com/mathieutu/vue-cli-plugin-express#readme
- Issues: https://github.com/mathieutu/vue-cli-plugin-express/issues
- npm.io page: https://npm.io/package/vue-cli-plugin-express

## Dependencies (9)

- [esm](https://npm.io/package/esm.md) 3.2.25
- [chalk](https://npm.io/package/chalk.md) ^2.4.1
- [express](https://npm.io/package/express.md) ^4.17.1
- [nodemon](https://npm.io/package/nodemon.md) ^1.19.1
- [ts-node](https://npm.io/package/ts-node.md) ^7.0.1
- [cli-table](https://npm.io/package/cli-table.md) ^0.3.1
- [portfinder](https://npm.io/package/portfinder.md) ^1.0.21
- [express-list-endpoints](https://npm.io/package/express-list-endpoints.md) ^4.0.1
- [connect-history-api-fallback](https://npm.io/package/connect-history-api-fallback.md) ^1.5.0

## Recent versions

- 1.0.2 (latest) — 2019-07-12
- 1.0.1 — 2019-04-27
- 1.0.0 — 2019-02-11
- 0.0.4 — 2018-10-07
- 0.0.3 — 2018-10-06
- 0.0.2 — 2018-10-06

## README

# vue-cli-plugin-express

[![npm](https://img.shields.io/npm/v/vue-cli-plugin-express.svg) ![npm](https://img.shields.io/npm/dt/vue-cli-plugin-express.svg)](https://www.npmjs.com/package/vue-cli-plugin-express)
[![vue-cli3](https://img.shields.io/badge/vue--cli-3.x-brightgreen.svg)](https://github.com/vuejs/vue-cli)

**:rocket: Add an API in your Vue application in 2 minutes!**

This is a vue-cli 3.x plugin to add an Node Express server in your Vue project.

<br>

![screenshot](./screenshot.png)

<br>

**:star: Features:**

- Included fully customizable Express Server:
  - Just add your api routes into your project (with import/export support) without thinking to something else.
  - Optional automatic fallback to the Vue app, to serve both the api and the application with only one command. 
  - Optional socket.io support.
- (soon) Included optional example routes and components.

## Table of contents

- [Getting started](#getting-started)
- [Usage](#usage)
- [Injected Commands](#injected-commands)
- [Configuration](#configuration)
- [Use your app in production](#use-your-app-in-production)

---

## Getting started

:warning: Make sure you have vue-cli 3.x.x:

```
vue --version
```

If you don't have a project created with vue-cli 3.x yet:

```
vue create my-new-app
```

Navigate to the newly created project folder and add the cli plugin:

```
cd my-new-app
vue add express
```
Soon:
*:information_source: An example `APIExample.vue` component will be added into your sources if you chose to include the examples.*

## Usage

To start your server for development purpose, use this commands:

```
yarn express
```

The server will be automatically restarted when a change is detected.

You just then have to start the app:

```
yarn serve
```

To run the server only once for production use, run:
```
yarn express:run
```

**Updating `vue-cli-plugin-express` will update the Express server service :+1:**

## Injected Commands

- **`vue-cli-service express:watch`**

  Run the Express server with info from `./srv` and watch the files to restart itself automatically.

- **`vue-cli-service express:run`**

  Run the Express server with info from `./srv` once.

## Configuration

The Express Server can be configured via the `pluginOptions` in `vue.config.js`:

```js
module.exports = {
  // Other options...
  pluginOptions: {
    // Express-related options
    express: {
        shouldServeApp: true,
        serverDir: './srv',
      },
    },
  },
}
```

## Use your app in production

Move `@vue/cli-service` from `devDependencies`to `dependencies`.

Execute the following commands:
```bash
yarn build
yarn express:run
```

For most of cloud hosting services, you can add a `start` command that will be triggered automatically:
```json
{
  "scripts": {
    "start": "yarn express:run" 
  }
}
```

---
_Source: https://npm.io/package/vue-cli-plugin-express · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._