feat(build): build library using bili (#49)

adds new build process and new exports for cjs, umd and esm

Co-authored-by: Matteo Gabriele <[email protected]>

.eslintignore

@@ -0,0 +1,2 @@
+dist/
+coverage/

bili.config.dev.js

@@ -0,0 +1,13 @@
+import { name } from "./package.json";
+
+const config = {
+  input: {
+    [name]: "./src/index.js"
+  },
+  output: {
+    dir: "./dist/",
+    format: "esm"
+  }
+};
+
+export default config;

bili.config.js

@@ -0,0 +1,14 @@
+import { name } from "./package.json";
+
+const config = {
+  input: {
+    [name]: "./src/index.js"
+  },
+  output: {
+    dir: "./dist/",
+    format: ["esm", "cjs", "umd", "umd-min"],
+    moduleName: "VueGtag"
+  }
+};
+
+export default config;

package.json

@@ -13,17 +13,19 @@
   },
   "scripts": {
     "commit": "git-cz",
-    "build": "webpack --mode production",
-    "dev": "webpack --mode development --watch",
-    "lint": "eslint src --ext .js",
-    "lint:fix": "eslint src --ext .js --fix",
+    "clean": "del-cli dist",
+    "prebuild": "yarn clean",
+    "build": "bili",
+    "dev": "bili --config bili.config.dev.js --watch",
+    "lint": "eslint --ext .js .",
+    "lint:fix": "yarn lint --fix",
     "test": "jest",
     "test:ci": "jest --coverage --bail --runInBand --verbose=false",
     "coverage": "jest --coverage",
     "coverage:html": "jest --coverage --coverageReporters=html",
     "coverage:text": "jest --coverage --coverageReporters=text",
     "coverage:lcov": "jest --coverage --coverageReporters=lcov",
-    "prepublishOnly": "yarn lint && yarn test && webpack --mode production",
+    "prepublishOnly": "yarn lint && yarn test && yarn build",
     "semantic-release": "semantic-release"
   },
   "config": {
@@ -54,7 +56,10 @@
     "vue",
     "vuejs"
   ],
-  "main": "dist/vue-gtag.js",
+  "main": "./dist/vue-gtag.js",
+  "module": "./dist/vue-gtag.esm.js",
+  "unpkg": "./dist/vue-gtag.umd.js",
+  "jsdelivr": "./dist/vue-gtag.umd.js",
   "types": "vue-gtag.d.ts",
   "files": [
     "dist",
@@ -69,26 +74,21 @@
     "@babel/preset-env": "^7.7.1",
     "@vue/test-utils": "^1.0.0-beta.29",
     "babel-eslint": "^10.0.3",
-    "babel-loader": "^8.0.6",
-    "clean-webpack-plugin": "^3.0.0",
+    "bili": "^4.8.1",
     "commitizen": "^4.0.3",
-    "compression-webpack-plugin": "^3.0.0",
     "cz-conventional-changelog": "^3.0.2",
+    "del-cli": "^3.0.0",
     "eslint": "^6.6.0",
     "eslint-config-prettier": "^6.7.0",
-    "eslint-loader": "^3.0.2",
     "eslint-plugin-jest": "^23.0.4",
     "eslint-plugin-prettier": "^3.1.1",
     "eslint-plugin-vue": "^6.0.1",
     "flush-promises": "^1.0.2",
     "jest": "^24.9.0",
     "prettier": "^1.19.1",
     "semantic-release": "^15.13.31",
-    "terser-webpack-plugin": "^2.2.1",
     "vue": "^2.6.10",
     "vue-router": "^3.1.3",
-    "vue-template-compiler": "^2.6.10",
-    "webpack": "^4.41.2",
-    "webpack-cli": "^3.3.10"
+    "vue-template-compiler": "^2.6.10"
   }
 }

src/index.js

@@ -3,6 +3,7 @@ import _bootstrap from "./bootstrap";
 import api from "./api";
 
 export default install;
+export { install };
 
 export const bootstrap = _bootstrap;
 export const setOptions = _setOptions;