chore(deps): upgrade dependencies.

1. upgrade dependencies.
2. use native es modules.

Author: scopewu

example/server.js

@@ -1,7 +1,7 @@
-const http = require('http')
-const { createSSRApp } = require('vue')
-const { renderToString } = require('vue/server-renderer')
-const QrcodeVue = require('../dist/qrcode.vue.cjs')
+import http from 'http'
+import { createSSRApp } from 'vue'
+import { renderToString } from 'vue/server-renderer'
+import QrcodeVue from '../dist/qrcode.vue.esm.js'
 
 const PORT = process.env.PORT || 3000
 
@@ -33,4 +33,4 @@ http.createServer(async (request, response) => {
   response.end(html)
 }).listen(PORT)
 
-console.log(`The server running at http: localhost:${PORT}`)
+console.log(`The server running at http://localhost:${PORT}`)

package.json

@@ -1,13 +1,22 @@
 {
   "name": "qrcode.vue",
-  "version": "3.3.3",
+  "version": "3.3.4",
   "description": "A Vue.js component to generate QRCode.",
-  "main": "dist/qrcode.vue.cjs.js",
-  "module": "dist/qrcode.vue.esm.js",
-  "browser": "dist/qrcode.vue.browser.js",
-  "unpkg": "dist/qrcode.vue.browser.min.js",
-  "jsdelivr": "dist/qrcode.vue.browser.min.js",
-  "typings": "dist/index.d.ts",
+  "type": "module",
+  "main": "./dist/qrcode.vue.cjs.js",
+  "module": "./dist/qrcode.vue.esm.js",
+  "browser": "./dist/qrcode.vue.browser.js",
+  "unpkg": "./dist/qrcode.vue.browser.min.js",
+  "jsdelivr": "./dist/qrcode.vue.browser.min.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/qrcode.vue.esm.js",
+      "require": "./dist/qrcode.vue.cjs.js"
+    },
+    "./package": "./package.json"
+  },
   "scripts": {
     "start": "webpack serve --config webpack.config.js --mode=development",
     "build": "rimraf dist && rollup -c"
@@ -41,21 +50,22 @@
   },
   "dependencies": {},
   "devDependencies": {
-    "@rollup/plugin-commonjs": "^22.0.1",
-    "@vue/compiler-sfc": "^3.2.37",
-    "@vue/server-renderer": "^3.2.37",
+    "@rollup/plugin-commonjs": "^24.0.1",
+    "@rollup/plugin-node-resolve": "^15.0.1",
+    "@rollup/plugin-terser": "^0.4.0",
+    "@vue/compiler-sfc": "^3.2.47",
+    "@vue/server-renderer": "^3.2.47",
     "html-webpack-plugin": "^5.5.0",
     "qr.js": "^0.0.0",
-    "rimraf": "^3.0.2",
-    "rollup": "^2.75.7",
-    "rollup-plugin-terser": "^7.0.2",
-    "rollup-plugin-typescript2": "^0.32.1",
-    "ts-loader": "^9.3.1",
-    "typescript": "^4.7.4",
-    "vue": "^3.2.37",
-    "vue-loader": "^17.0.0",
-    "webpack": "^5.73.0",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.9.3"
+    "rimraf": "^4.4.0",
+    "rollup": "^3.19.1",
+    "rollup-plugin-typescript2": "^0.34.1",
+    "ts-loader": "^9.4.2",
+    "typescript": "^4.9.5",
+    "vue": "^3.2.47",
+    "vue-loader": "^17.0.1",
+    "webpack": "^5.76.1",
+    "webpack-cli": "^5.0.1",
+    "webpack-dev-server": "^4.11.1"
   }
 }

rollup.config.js

@@ -1,8 +1,9 @@
 import ts from 'rollup-plugin-typescript2'
 import commonjs from '@rollup/plugin-commonjs'
-import { terser } from 'rollup-plugin-terser'
+import terser from '@rollup/plugin-terser'
+import { nodeResolve } from '@rollup/plugin-node-resolve'
 
-import pkg from './package.json'
+import pkg from './package.json' assert { type: 'json' }
 
 const banner =
   '/*!' +
@@ -41,6 +42,7 @@ function createEntry(options) {
           exclude: ['src', 'example'],
         }
       }),
+      nodeResolve(),
       commonjs({
         // non-CommonJS modules will be ignored, but you can also
         // specifically include/exclude files

webpack.config.js

@@ -1,8 +1,10 @@
-const path = require('path')
-const HtmlWebpackPlugin = require('html-webpack-plugin')
-const { VueLoaderPlugin } = require('vue-loader')
+import path from 'path'
+import HtmlWebpackPlugin from 'html-webpack-plugin'
+import { VueLoaderPlugin } from 'vue-loader'
 
-module.exports = (env, { mode = 'production' }) => {
+const dirname = new URL('.', import.meta.url).pathname
+
+const config = (env, { mode = 'production' }) => {
   const isProd = mode === 'production'
 
   return {
@@ -12,7 +14,7 @@ module.exports = (env, { mode = 'production' }) => {
       main: './example/webpack-entry.ts',
     },
     output: {
-      path: path.resolve(__dirname, './example/dist'),
+      path: path.resolve(dirname, './example/dist'),
       filename: isProd ? '[name].[contenthash].js' : '[name].js',
     },
     resolve: {
@@ -69,3 +71,5 @@ module.exports = (env, { mode = 'production' }) => {
     },
   }
 }
+
+export default config