【笔记】Webpack打包Vue文件

发表于 更新于 阅读次数：

前言

Webpack打包Vue文件

下载依赖

1
npm install vue

修改配置文件

webpack.config.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const { VueLoaderPlugin } = require("vue-loader/dist/index")

module.exports = {
  module: {
    rules: [
      {
        test: /\.vue$/,
        loader: "vue-loader"
      }
    ]
  },
  plugins: [
    new VueLoaderPlugin()
  ]
}

引入Vue文件

index.html
1
<div id="app"></div>
src/App.vue
1
2
3
4
5
6
7
8
<template>
</template>

<script>
</script>

<style>
</style>
src/main.js
1
2
3
4
import { createApp } from "vue"
import App from "./App.vue"

createApp(App).mount("#app")

完成