![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
webpack
昵称叫铃风的小前端
这个作者很懒,什么都没留下…
展开
-
webpack中文文档——指南笔记
npm i安装依赖node_modules起步准备文件:略构建:npx webpack,默认打包main.js到src目录管理资源加载 CSS:1.依赖2.配置3.新建css文件4.index.js引入5.打包加载图片字体加载数据管理输出输出多个bundle.jsHtmlWebpackPlugin注意:webpack和webpack-cli不...原创 2019-11-27 17:41:14 · 377 阅读 · 0 评论 -
webpack中文文档——笔记
入口输出:注意,即使可以存在多个入口起点,但只指定一个输出配置。loaderplugins配置模块解析manifest热更新webpack-dev-serve原创 2019-11-18 19:43:34 · 158 阅读 · 0 评论 -
webpack——在组件里面设置某段代码跳过eslint检测
https://www.jianshu.com/p/49a7ffc68975原创 2019-10-24 09:51:35 · 983 阅读 · 0 评论 -
《深入浅出webpack》学习7——vue项目(非cli)引入eslint检测
1.安装依赖:eslint2.配置webpack.config.js:exclude忽略node_modules文件夹enforce:将该检测放到其他loader之前,检测通过才会进入其他loader处理3.根目录创建.eslintrc.js文件,配置:4.启动npm run server(配置server在前面已整理过)5.错误测试报错参考上节...原创 2019-07-11 19:41:45 · 147 阅读 · 0 评论 -
《深入浅出webpack》学习6——3.7:配置可以使用.vue模板来开发单页面应用(类似于实现vue-cli)
1.安装依赖:vue vue-loader vue-template-compiler2.配置webpack.config.js:使用vue-loader来处理.vue文件3.创建相关文件:index.html:app.vue:main.js:整体目录结构:4.打包:npm run bulid生成./dist/bundle.js下一节总结vue引入eslint检测...原创 2019-07-11 19:06:36 · 107 阅读 · 0 评论 -
《深入浅出webpack》学习5——3.16:eslint代码检查
1.安装eslint2.执行eslint init生成.eslintrc.js也可以手动创建文件.eslintry.js,配置如下:3.启动,成功测试:如果缩进不是2个空格,浏览器则会报如下错误cmd报错:这是基本html css js版,下面讲自己配置可以解析.vue格式的文件以及eslint的响应配置...原创 2019-07-11 18:43:04 · 278 阅读 · 0 评论 -
《深入浅出webpack》学习4——1.6:webpack-dev-server启动本地服务器
1.安装webpack-dev-server它配合node,帮我们开启本地服务器2.书中说安装后执行webpack-dev-server即可但实际会报错:百度,尝试了webpack-dev-server --line、webpack-dev-server --content-base ./等命令,还是同样的错误最后成功的方法:配置package.json配置webpack.con...原创 2019-07-10 17:01:04 · 2004 阅读 · 0 评论 -
《深入浅出webpack》学习3——1.5:改造1.4打包出独立的css文件
1.需要使用插件:extract-text-webpack-plugin2.html引用打包后的css文件:3.配置webpack.config.js:执行打包后报错:网上提供了几个方案,最简单的是把23行contenthash改成hash,打包生成main_ed9713af.css问题:html如何引入有hash的css文件方法2,更改写法:打包后生成style.css:...原创 2019-07-09 22:08:17 · 132 阅读 · 0 评论 -
《深入浅出webpack》学习——1.4:打包最简单的css文件
1.需要安装两个包:css-loader style-loader2.根目录创建index.css文件3.main.js引入css文件:4.配置webpack.config.js5.index.html引入打包后的css文件6.执行npm run build打包,css将会被注入./dist/bundle.js中此时的目录结构:7.打开index.html:8.分析这样...原创 2019-07-09 21:32:54 · 193 阅读 · 0 评论 -
《深入浅出webpack》学习——1.1至1.3:安装环境、打包最基本的文件结构
顺序以1.安装webpackcnpm install webpack -g2.安装 webpack-clicnpm install webpack-cli -g3.查看版本:webpack --version4.初始化文件夹cnpm init完成后文件夹出现package.json5.cnpm i安装依赖,出现node_modules文件夹6.在根目录创建index.ht...原创 2019-07-09 21:14:36 · 145 阅读 · 0 评论