├── .nvmrc
├── .browserslistrc
├── public
├── flame.avi
├── favicon.ico
└── index.html
├── src
├── assets
│ └── logo.png
├── main.js
└── App.vue
├── babel.config.js
├── .gitignore
├── .eslintrc.cjs
├── README.md
├── .github
├── dependabot.yml
└── workflows
│ ├── deploy-gh.yml
│ └── ci.yml
├── package.json
└── vue.config.js
/.nvmrc:
--------------------------------------------------------------------------------
1 | 17.8.0
2 |
--------------------------------------------------------------------------------
/.browserslistrc:
--------------------------------------------------------------------------------
1 | > 1%
2 | last 2 versions
3 | not dead
4 |
--------------------------------------------------------------------------------
/public/flame.avi:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/ffmpegwasm/vue-app/HEAD/public/flame.avi
--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/ffmpegwasm/vue-app/HEAD/public/favicon.ico
--------------------------------------------------------------------------------
/src/assets/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/ffmpegwasm/vue-app/HEAD/src/assets/logo.png
--------------------------------------------------------------------------------
/babel.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | presets: [
3 | '@vue/cli-plugin-babel/preset'
4 | ]
5 | }
6 |
--------------------------------------------------------------------------------
/src/main.js:
--------------------------------------------------------------------------------
1 | import { createApp } from 'vue'
2 | import App from './App.vue'
3 |
4 | createApp(App).mount('#app')
5 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules
3 | /dist
4 |
5 |
6 | # local env files
7 | .env.local
8 | .env.*.local
9 |
10 | # Log files
11 | npm-debug.log*
12 | yarn-debug.log*
13 | yarn-error.log*
14 | pnpm-debug.log*
15 |
16 | # Editor directories and files
17 | .idea
18 | .vscode
19 | *.suo
20 | *.ntvs*
21 | *.njsproj
22 | *.sln
23 | *.sw?
24 |
--------------------------------------------------------------------------------
/.eslintrc.cjs:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | root: true,
3 | env: {
4 | node: true,
5 | es6: true
6 | },
7 | extends: ["plugin:vue/vue3-strongly-recommended", "eslint:recommended"],
8 | parserOptions: {
9 | ecmaVersion: 8,
10 | requireConfigFile: false,
11 | parser: "@babel/eslint-parser",
12 | },
13 | rules: {},
14 | };
15 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # vue-app
2 |
3 | ## Project setup
4 | ```
5 | npm install
6 | ```
7 |
8 | ### Compiles and hot-reloads for development
9 | ```
10 | npm run serve
11 | ```
12 |
13 | ### Compiles and minifies for production
14 | ```
15 | npm run build
16 | ```
17 |
18 | ### Lints and fixes files
19 | ```
20 | npm run lint
21 | ```
22 |
23 | ### Customize configuration
24 | See [Configuration Reference](https://cli.vuejs.org/config/).
25 |
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 | <%= htmlWebpackPlugin.options.title %>
9 |
10 |
11 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/.github/dependabot.yml:
--------------------------------------------------------------------------------
1 | version: 2
2 | updates:
3 | # Fetch and update latest `npm` packages
4 | - package-ecosystem: npm
5 | directory: "/"
6 | schedule:
7 | interval: daily
8 | time: "00:00"
9 | open-pull-requests-limit: 10
10 | reviewers:
11 | - vinayakkulkarni
12 | assignees:
13 | - vinayakkulkarni
14 | commit-message:
15 | prefix: fix
16 | prefix-development: chore
17 | include: scope
18 | # Fetch and update latest `github-actions` pkgs
19 | - package-ecosystem: github-actions
20 | directory: "/"
21 | schedule:
22 | interval: daily
23 | time: "00:00"
24 | open-pull-requests-limit: 10
25 | reviewers:
26 | - vinayakkulkarni
27 | assignees:
28 | - vinayakkulkarni
29 | commit-message:
30 | prefix: fix
31 | prefix-development: chore
32 | include: scope
33 |
--------------------------------------------------------------------------------
/.github/workflows/deploy-gh.yml:
--------------------------------------------------------------------------------
1 | name: Build and Deploy
2 | on:
3 | push:
4 | branches:
5 | - main
6 | jobs:
7 | build-and-deploy:
8 | runs-on: ubuntu-latest
9 | steps:
10 | - name: Checkout 🛎️
11 | uses: actions/checkout@v3
12 |
13 | - name: Setup node env 📦
14 | uses: actions/setup-node@v3
15 | with:
16 | node-version-file: '.nvmrc'
17 | registry-url: https://registry.npmjs.org
18 | check-latest: true
19 | cache: 'npm'
20 |
21 | - name: Upgrade npm ✨
22 | run: npm i -g npm@latest
23 |
24 | - name: Install dependencies 🚀
25 | run: npm ci --prefer-offline --no-audit --no-optional
26 |
27 | - name: Build 🔧
28 | run: npm run build
29 |
30 | - name: Deploy to GitHub Pages 🚀
31 | uses: JamesIves/github-pages-deploy-action@v4.4.1
32 | with:
33 | branch: gh-pages
34 | folder: dist
35 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "vue-app",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "serve": "export NODE_OPTIONS=--openssl-legacy-provider; vue-cli-service serve",
7 | "build": "export NODE_OPTIONS=--openssl-legacy-provider; vue-cli-service build",
8 | "lint": "export NODE_OPTIONS=--openssl-legacy-provider; vue-cli-service lint"
9 | },
10 | "dependencies": {
11 | "@ffmpeg/ffmpeg": "^0.11.5",
12 | "core-js": "^3.25.5",
13 | "vue": "^3.2.41"
14 | },
15 | "devDependencies": {
16 | "@babel/eslint-parser": "^7.19.1",
17 | "@ffmpeg/core": "^0.11.0",
18 | "@vue/cli-plugin-babel": "^5.0.8",
19 | "@vue/cli-plugin-eslint": "^5.0.8",
20 | "@vue/cli-service": "^5.0.8",
21 | "@vue/compiler-sfc": "^3.2.41",
22 | "eslint": "^8.28.0",
23 | "eslint-plugin-vue": "^9.6.0",
24 | "vue-cli-plugin-compression": "^2.0.0",
25 | "zlib": "^1.0.5"
26 | },
27 | "author": {
28 | "name": "Vinayak Kulkarni",
29 | "email": "inbox.vinayak@gmail.com",
30 | "url": "https://vinayakkulkarni.dev"
31 | },
32 | "license": "MIT",
33 | "engines": {
34 | "node": ">=17.0.0",
35 | "npm": ">=8.0.0"
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/src/App.vue:
--------------------------------------------------------------------------------
1 |
2 |
6 |
7 |
10 | {{ message }}
11 |
12 |
13 |
51 |
52 |
62 |
--------------------------------------------------------------------------------
/vue.config.js:
--------------------------------------------------------------------------------
1 | const zlib = require('zlib');
2 | const path = require("path");
3 | const express = require("express");
4 | const { defineConfig } = require("@vue/cli-service");
5 |
6 | module.exports = defineConfig({
7 | outputDir: "dist",
8 | indexPath: "index.html",
9 | transpileDependencies: false,
10 | productionSourceMap: true,
11 | runtimeCompiler: true,
12 | lintOnSave: true,
13 | parallel: true,
14 | integrity: true,
15 | publicPath: process.env.NODE_ENV === "production" ? "/vue-app/" : "/",
16 | configureWebpack: {
17 | devServer: {
18 | onBeforeSetupMiddleware: ({ app }) => {
19 | app.use(
20 | "/node_modules/",
21 | express.static(path.resolve(__dirname, "node_modules"))
22 | );
23 | app.use((_, res, next) => {
24 | res.setHeader("Cross-Origin-Opener-Policy", "same-origin");
25 | res.setHeader("Cross-Origin-Embedder-Policy", "require-corp");
26 | next();
27 | });
28 | },
29 | },
30 | },
31 | pluginOptions: {
32 | compression: {
33 | brotli: {
34 | filename: '[file].br[query]',
35 | algorithm: 'brotliCompress',
36 | include: /\.(js|css|html|svg|json)(\?.*)?$/i,
37 | compressionOptions: {
38 | params: {
39 | [zlib.constants.BROTLI_PARAM_QUALITY]: zlib.constants.BROTLI_MAX_QUALITY,
40 | },
41 | },
42 | minRatio: 0.8,
43 | },
44 | gzip: {
45 | filename: '[file].gz[query]',
46 | algorithm: 'gzip',
47 | include: /\.(js|css|html|svg|json)(\?.*)?$/i,
48 | compressionOptions: { level: zlib.constants.Z_BEST_COMPRESSION },
49 | minRatio: 0.8,
50 | },
51 | },
52 | prettify: false,
53 | },
54 | });
55 |
--------------------------------------------------------------------------------
/.github/workflows/ci.yml:
--------------------------------------------------------------------------------
1 | name: ci
2 |
3 | on:
4 | push:
5 | branches:
6 | - main
7 | pull_request_target:
8 | branches:
9 | - main
10 |
11 | permissions:
12 | checks: write
13 | contents: read
14 |
15 | concurrency:
16 | group: ${{ github.workflow }}-${{ github.event_name == 'pull_request_target' && github.head_ref || github.ref }}
17 | cancel-in-progress: true
18 |
19 | jobs:
20 | ci:
21 | runs-on: ${{ matrix.os }}
22 |
23 | strategy:
24 | fail-fast: false
25 | matrix:
26 | os: [ubuntu-latest]
27 |
28 | steps:
29 | - name: Check out repository ✨
30 | if: ${{ github.event_name == 'push' || github.event_name == 'pull_request' || github.event_name == 'pull_request_target' && github.actor != 'dependabot[bot]' }}
31 | uses: actions/checkout@v3
32 |
33 | - name: Check out repository 🎉 (dependabot)
34 | if: ${{ github.event_name == 'pull_request_target' }}
35 | uses: actions/checkout@v3
36 | with:
37 | ref: ${{ github.event.pull_request.head.sha }}
38 |
39 | - name: Setup node env 📦
40 | uses: actions/setup-node@v3
41 | with:
42 | node-version-file: '.nvmrc'
43 | registry-url: https://registry.npmjs.org
44 | cache: 'npm'
45 | check-latest: true
46 |
47 | - name: Upgrade npm ✨
48 | run: npm i -g npm@latest
49 |
50 | - name: Install dependencies 🚀
51 | run: npm ci --prefer-offline --no-audit --no-optional
52 |
53 | - name: Run linter(s) 👀
54 | uses: wearerequired/lint-action@v2
55 | with:
56 | github_token: ${{ secrets.GITHUB_TOKEN }}
57 | continue_on_error: false
58 | neutral_check_on_warning: true
59 | auto_fix: false
60 | git_name: github-actions[bot]
61 | git_email: github-actions[bot]@users.noreply.github.com
62 | eslint: true
63 | eslint_extensions: js,ts,vue
64 |
65 | - name: Check build 🎉
66 | run: npm run build
67 |
--------------------------------------------------------------------------------