构建、打包工具
文章平均质量分 69
Eternal-memory
爱生活爱前端
展开
-
Webpack打包常见问题与报错
Webpack打包常见问题与报错 一、css中设置的背景图片找不到了,或者是url路径不对? 解决办法: 1、下载url-loader npm install --save-dev url-loader 2、 webpack.config.js中 module.exports = { module: { rules: [原创 2017-12-21 09:17:50 · 2286 阅读 · 0 评论 -
Webpack3的使用(一)
Webpack-v3.5.4的使用(一) 一、构建项目目录 (1)、运行node -v (2)、建立新文件夹: mkdir webpack-demo (3)、在新建文件夹中初始化npm: npm init (4)、安装webpack: npm install webpack --save-dev (若想安装固定版本则npm install webpack@1.13.2 --s原创 2017-12-18 17:09:16 · 476 阅读 · 0 评论 -
Webpack3的使用(二)
Webpack-v3.5.4的使用(二) Webpack-v3.5.4的使用(二)中,提到: 目前html文件中只是引用一个script文件,且是固定的文件名,打包以后的文件名不确定,怎样避免手动设置路径? 那么接下来就是插件html-webpack-plugin登场了! (一)、安装 1、安装插件 npm install html-webpac原创 2017-12-19 13:31:41 · 509 阅读 · 0 评论 -
Webpack3的使用(三)
Webpack-v3.5.4的使用(三) 一、什么是loader以及loader的特性 loader是用来处理资源文件的,接受的资源文件是一个参数,loader处理完以后会返回一个新的资源 特性: 可以是串联的 可以是同步也可以是异步,可以再node.js环境下运行 后边可以跟参数可以通过正则表达式直接指定文件的后缀名,即指定某一个后缀名的文件由某原创 2017-12-19 14:10:16 · 383 阅读 · 0 评论 -
Webpack3的使用(四)
Webpack-v3.5.4(四) 接着上篇笔记Webpack-v3.5.4的使用(三),这篇笔记记录怎么处理简单的模板文件 1、首先下载html-loader 2、编辑模板文件内容 3、在webpack.config.js中进行配置 4、效果展示: 下回的随笔则是用webpack处理图片文件原创 2017-12-20 13:28:24 · 305 阅读 · 0 评论 -
Webpack3的使用(五)
Webpack-v3.5.4的使用(五) 这篇笔记记录一下用webpack处理简单的图片文件 步骤如下: 1、css中指定相对路径的图片 创建存放图片的文件, 引入图片 页面效果: 2、压缩图片 npm install image-webpack-loader --save-dev { test: /\.(png|jpg|gif|原创 2017-12-20 14:04:18 · 278 阅读 · 0 评论