Add an integrated build

b2e3dcf0 · Valentin Rigal · 4a6c547e · b2e3dcf0 · b2e3dcf0 · b2e3dcf0
Commit b2e3dcf0 authored 3 years ago by Valentin Rigal
--- a/README.md
+++ b/README.md
@@ -9,3 +9,8 @@

 ### Chromium
 `npm run start:chromium`
+
+## Integration as a JS asset
+`cd demo`
+`npm run serve`
+`firefox index.html`
--- a/demo/.gitignore
+++ b/demo/.gitignore
+.DS_Store
+node_modules
+/dist
+
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Vue Browser Extension Output
+*.pem
+*.pub
+*.zip
+/artifacts
--- a/demo/index.html
+++ b/demo/index.html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>Virtual keyboard demo</title>
+</head>
+
+<body>
+  <div class="container">
+    <p>
+      <input placeholder="Try to write an 'a'"></input>
+    </p>
+    <p>
+      <textarea placeholder="This is a textarea"></textarea>
+    </p>
+  </div>
+  <script src="dist/keyboard.js"></script>
+</body>
+</html>
--- a/demo/package-lock.json
+++ b/demo/package-lock.json
--- a/demo/package.json
+++ b/demo/package.json
+{
+  "name": "keyboard",
+  "version": "0.1.0",
+  "description": "Integration build",
+  "scripts": {
+    "serve": "webpack --config webpack.keyboard.js --watch"
+  },
+  "dependencies": {
+    "axios": "^0.21.1",
+    "core-js": "^3.6.5",
+    "vue": "^2.6.11",
+    "vue-router": "^3.2.0",
+    "vuex": "^3.4.0"
+  },
+  "devDependencies": {
+    "compression-webpack-plugin": "^7.1.1",
+    "mini-css-extract-plugin": "^1.3.3",
+    "vue-loader": "^15.9.6",
+    "webpack": "^5.11.1",
+    "webpack-cli": "^4.7.0"
+  }
+}
--- a/demo/webpack.keyboard.js
+++ b/demo/webpack.keyboard.js
+const path = require("path");
+const VueLoaderPlugin = require("vue-loader/lib/plugin");
+const CompressionPlugin = require("compression-webpack-plugin");
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+
+module.exports = {
+  mode: "development",
+
+  entry: {
+    keyboard: "../src/content/content.js",
+  },
+
+  output: {
+    filename: "[name].js",
+    path: path.resolve(__dirname, "./dist/"),
+    publicPath: "",
+  },
+
+  plugins: [
+    new MiniCssExtractPlugin(),
+    new VueLoaderPlugin(),
+    new CompressionPlugin({
+      test: /\.(js|css)$/,
+    }),
+  ],
+
+  module: {
+    rules: [
+      { test: /\.css$/, use: [MiniCssExtractPlugin.loader, "css-loader"] },
+      {
+        test: /\.(png|jpe?g|gif|woff|woff2|eot|ttf|otf|svg)$/i,
+        use: ["file-loader"],
+      },
+      { test: /\.vue$/, use: ["vue-loader"] },
+    ],
+  },
+
+  resolve: {
+    alias: {
+      vue$: "vue/dist/vue",
+    },
+  },
+};