使用 vue-loader 可以实现 vue 组件的热更新,16版本的 vue-loader 用于 Vue3,Vue2应该使用16以前的版本。

    1. yarn add vue@2.6.14
    2. yarn add vue-template-compiler vue-loader
    1. // webpack 配置文件
    2. //...
    3. const VueLoaderPlugin = require('vue-loader/lib/plugin') // 15版本需要手动配置使用插件,14不用
    4. module.exports = {
    5. mode: 'development',
    6. devtool: false,
    7. entry: './src/index.js',
    8. output: {
    9. filename: 'js/main.js',
    10. path: path.resolve(__dirname, 'dist')
    11. },
    12. target: 'web',
    13. devServer: {
    14. hot: true
    15. },
    16. module: {
    17. rules: [
    18. {
    19. test: /\.vue$/,
    20. use: ['vue-loader']
    21. }
    22. ]
    23. },
    24. plugins: [
    25. //...
    26. new VueLoaderPlugin()
    27. ]
    28. }