在webpack中配置vue.js
这里有两种在webpack中配置vue.js的方法,如下:
1.在main.js中引入vue的包:
index.html:
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> ???<title>Title</title> ???<style> ???</style> ???<!--注意不推荐在这里引入任何包和css文件--> ???<!--由于es6语法浏览器不识别 会报错--> ???<!--<script src="../dist/bundle.js"></script>--> ???<!--<script src="/bundle.js"></script>--></head><body><h1>下面是vue的内容:</h1><div id="app"> ???<p>{{msg}}</p></div></body></html>main.js:
//在webpack中使用vue//注意在webpack中 使用 import Vue from ?'vue' 导入的vue不完整import Vue from ?'../node_modules/vue/dist/vue.js'var vm = new Vue({ ???el:"#app", ???data:{ ???????msg:'123' ???}})2.在main.js中引入vue的包使用优雅的import Vue from ‘vue‘方式导入
main.js:
//在webpack中使用vue//注意在webpack中 使用 import Vue from ?'vue' 导入的vue不完整import Vue from ?'vue'var vm = new Vue({ ???el:"#app", ???data:{ ???????msg:'123' ???}})这里需要修改下相应的webpack.config.js
webpack.config.js:
module:{ ???????resolve: { ???????alias:{//设置vue被导入时候的包的路径 ???????????"vue$":"vue/dist/vue.js" ???????} ???} ????????}在webpack中配置vue.js
原文地址：https://www.cnblogs.com/charlypage/p/9949256.html