webpack笔记

原创 63966249 随笔 webpack 103阅读 2018-12-25 18:05:21 举报

配一个脚手架
Jrain Lau https://segmentfault.com/a/1190000006190814?utm_source=weekly&utm_medium=email&utm_campaign=email_weekly#articleHeader0

相关教程:
webpack核心概念 https://www.jianshu.com/p/c979126e68aa 快速熟悉webpack
此处是各种阮一峰的webpack链接http://www.baozhuang5.com/ziliao.php?s=webpack%E9%98%AE%E4%B8%80%E5%B3%B0
https://www.jb51.net/article/132382.htm
https://webpack.wuhaolin.cn/ 吴晓峰的一本专业的书
https://www.jianshu.com/p/cd123afa196a阮一峰(机翻
webpack常用配置 https://www.cnblogs.com/y896926473/articles/6011711.html

从零开始搭建前端工具 https://segmentfault.com/a/1190000006190814?utm_source=weekly&utm_medium=email&utm_campaign=email_weekly#articleHeader0

vue-cli最全解析 https://blog.csdn.net/xiaoyangerbani/article/details/80735310
https://blog.csdn.net/wulala_hei/article/details/80488674

参考流程https://www.jianshu.com/p/88c981a977bf 不一定照搬此文章,细节操作百度实践

https://blog.csdn.net/Bs__Q/article/details/79769541

package.josn详细介绍阮一峰
http://javascript.ruanyifeng.com/nodejs/packagejson.html#toc1

初始化配置npm init
安装webpack npm install webpack --save-dev
注意:webpack 4.X 开始,需要安装 webpack-cli 依赖 ,所以使用这条命令 npm install webpack webpack-cli -g
安装热更新 npm install webpack-dev-server --save-dev
然后配置输入输出的文件,进行初始化
配置package.josn 指令 列如dev build
启动的是main.js
新建的一个html文件挂载在上面的元素上

然后npm run dev

css样式需要配置style-loader和css-loader、extract-text-webpack-plugin 的插件

用到.vue为后缀的文件,则需要在webpack中使用vue-loader就可以对.vue格式的文件进行处理

安装vue-loader、vue-style-loader等加载器并做配置;要使用es6语法,需要安装babel和babel-loader等加载器并做配置

配置url-loader和file-loader来支持图片、字体等文件

突然发现裤衩哥的教程不错,新手一定要看看,附上链接:
https://github.com/wallstreetcn/webpack-and-spa-guide

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复