fix: ERR when get dirname on Windows.

Upgrade some deps.

Author: scopewu

README-zh_cn.md

@@ -4,7 +4,7 @@
 
 🔒 如果你正在使用 Vue 2，请保持 `qrcode.vue` 的版本为 `1.x`;
 
-一款 Vue.js 二维码组件.
+一款 Vue.js 二维码组件，同时支持 Vue 2 和 Vue 3.
 
 [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/scopewu/qrcode.vue/blob/master/LICENSE)
 

README.md

@@ -4,7 +4,7 @@
 
 🔒 if you are using Vue 2.x, please keep using version `1.x`;
 
-A Vue.js component to generate [QRCode](https://en.wikipedia.org/wiki/QR_code).
+A Vue.js component to generate [QRCode](https://en.wikipedia.org/wiki/QR_code). Both support Vue 2 and Vue 3.
 
 [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/scopewu/qrcode.vue/blob/master/LICENSE)
 

example/webpack-entry.ts

@@ -1,15 +1,16 @@
 import { createApp, defineComponent, onMounted, ref } from 'vue'
 import QrcodeVue from '../src'
+import type { Level, RenderAs } from '../src'
 
 const App = defineComponent({
   components: { QrcodeVue },
   setup() {
     const value = ref('https://example.com')
     const size = ref(100)
-    const level = ref<'L' | 'M' | 'Q' | 'H'>('L')
+    const level = ref<Level>('L')
     const background = ref('#ffffff')
     const foreground = ref('#000000')
-    const renderAs = ref<'canvas' | 'svg'>('svg')
+    const renderAs = ref<RenderAs>('svg')
     const margin = ref(0)
 
     const stargazersCount = ref(500)

example/webpack.html

@@ -31,8 +31,8 @@
   <meta name="twitter:creator" content="@ngwwj" />
   <link
     rel="stylesheet"
-    href="https://unpkg.com/bootstrap@5.1.3/dist/css/bootstrap.min.css"
-    integrity="sha512-GQGU0fMMi238uA+a/bdWJfpUGKUkBdgfFdgBm72SUQ6BeyWjoY/ton0tEjH+OSH9iP4Dfh+7HM0I9f5eR0L/4w=="
+    href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
+    integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
     crossorigin="anonymous"
     referrerpolicy="no-referrer"
   />

package.json

@@ -1,7 +1,7 @@
 {
   "name": "qrcode.vue",
   "version": "3.4.1",
-  "description": "A Vue.js component to generate QRCode.",
+  "description": "A Vue.js component to generate QRCode. Both support Vue 2 and Vue 3",
   "type": "module",
   "main": "./dist/qrcode.vue.cjs.js",
   "module": "./dist/qrcode.vue.esm.js",
@@ -51,15 +51,14 @@
   "dependencies": {},
   "devDependencies": {
     "@rollup/plugin-terser": "^0.4.4",
-    "@vue/compiler-sfc": "^3.3.7",
-    "@vue/server-renderer": "^3.3.7",
-    "html-webpack-plugin": "^5.5.3",
-    "rollup": "^4.3.0",
+    "@vue/compiler-sfc": "^3.3.11",
+    "@vue/server-renderer": "^3.3.11",
+    "html-webpack-plugin": "^5.5.4",
+    "rollup": "^4.8.0",
     "rollup-plugin-typescript2": "^0.36.0",
-    "ts-loader": "^9.5.0",
-    "typescript": "^5.2.2",
-    "vue": "^3.3.7",
-    "vue-loader": "^17.3.1",
+    "ts-loader": "^9.5.1",
+    "typescript": "^5.3.3",
+    "vue": "^3.3.11",
     "webpack": "^5.89.0",
     "webpack-cli": "^5.1.4",
     "webpack-dev-server": "^4.15.1"

typings/index.d.ts

@@ -1,5 +1,3 @@
-declare module 'qr.js/lib/QRCode.js'
-declare module 'qr.js/lib/ErrorCorrectLevel.js'
 
 // shims-vue.d.ts
 declare module '*.vue' {

webpack.config.js

@@ -1,8 +1,8 @@
 import path from 'path'
+import { fileURLToPath } from 'url'
 import HtmlWebpackPlugin from 'html-webpack-plugin'
-import { VueLoaderPlugin } from 'vue-loader'
 
-const dirname = new URL('.', import.meta.url).pathname
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
 
 const config = (env, { mode = 'production' }) => {
   const isProd = mode === 'production'
@@ -14,7 +14,7 @@ const config = (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: {
@@ -46,7 +46,6 @@ const config = (env, { mode = 'production' }) => {
       ],
     },
     plugins: [
-      new VueLoaderPlugin(),
       new HtmlWebpackPlugin({
         template: 'example/webpack.html',
         minify: {