利用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的兩種方式啦