vue+webpack学习笔记一

今天开始学习组合使用vue+webpack,不过由于教学视频版本和当前版本不一致,所以我主要是为记录遇到的问题以及如何解决他们。(可以直接拉倒文章末尾查看总结)



放上今天的猪脚代码。

1.先使用npm init,初始化为一个npm项目,其中,需要手动写一些项目信息,这里我全选择默认。

结果就生成了一个package.json文件

2.按照需要使用的npm包猪脚webpack+vue,代码是npm i webpack vue vue-loader vue-template-compiler css-loader 

3.创建源文件夹,顺手放上测试用例app.vue,index.js


app.vue


index.js

4.然后配置webpack.config.js


webpack.config.js



完成代码部署,就尝试运行,npm run dev,但是报错了


报错截图

如果将代码进行修改成这样


修改后

运行就正常了



总结

vue-loader@15.*之后除了必须带有VueLoaderPlugin 之外,还需另外单独配置css-loader。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容