利用webpack引入Vue的兩種方式

首先局部安裝webpack以及Vue

npm i webpack -D

npm i vue -D

第一種 直接引入

在入口js文件中 直接引入

import Vue from '../node_modules/vue/dist/vue.js';

引入后就可以直接在入口js文件中使用

//入口文件寫入

    import Vue from '../node_modules/vue/dist/vue.js';

//然后就可以直接用

var app =new Vue({

    el:"#app",

    data:{

        msg:"123"

    }

})

第二種方式 配置文件的方式--推薦使用

在webpack.config.js文件中的module.exports中寫入

resolve: {

alias: {

vue:"vue/dist/vue.js"

    }

}

然后第再到入口js文件中引入

import Vuefrom 'vue';

var app =new Vue({

el:"#app",

    data:{

msg:"123"

    }

})

上面這兩種方式都是可以實現(xiàn)Vue引入的，如果控制臺報錯找不到元素 那么可能需要在入口js中加一句入口函數(shù) 如下

import Vuefrom 'vue';

window.onload=function () {

var app =new Vue({

el:"#app",

        data:{

msg:"123"

        }

})

}

以上就是webpack引入Vue的兩種方式啦