webpack4前言背景用途不多说，上来就干。从最简单的demo到项目中的实践。(指令是window 平台下，并且使用了cnpm 来安装包的依赖.)一.基础demo 1.初始化项目 npm init -y 会在项目目录下创建package.json 文件.2.安装webpack webpack-cl ...
分类：
Web程序 时间：
2020-04-25 12:40:41
阅读次数：
84
主要是首屏加载太慢。 大文件定位我们可以使用webpack可视化插件Webpack Bundle Analyzer 查看工程js文件大小，然后有目的的解决过大的js文件。 安装 npm install --save-dev webpack-bundle-analyzer 在webpack中设置如下， ...
分类：
其他好文 时间：
2020-04-25 01:00:59
阅读次数：
60
网上可搜到的解决办法是修改webpack配置，显示指定tsconfig.json 个人理解：这样做意外着webpack没有找到配置文件，并不是报错中说的files选项为空 但修改配置后并没解决整个报错 { test: /\.tsx?$/, loader: "ts-loader", exclude: ...
分类：
Web程序 时间：
2020-04-24 17:25:08
阅读次数：
225
webpack安装（安装环境需要node环境 所以安装node） webpack基本使用：新建dist和src文件夹 运行命令： webpack ./src/main.js dist/bundle.js webpack配置 ：新建webpack.config.js文件 const path = re ...
分类：
Web程序 时间：
2020-04-24 00:52:54
阅读次数：
94
为什么要使用第三方loader 一般引入样式文件，我们会在html中引入样式标签。 很明显，这样就跟之前在script中引入js文件一样，会导致二次请求。我们希望webpack像处理js文件一样处理样式文件。 如何引入样式 于是我们在入口文件， 在main.js中通过import方式引入样式文件 。 ...
分类：
Web程序 时间：
2020-04-24 00:46:43
阅读次数：
107
症结 在利用webpack脚手架搭建vue项目后，往往最终打包的.js和.css文件过于庞大，造成首次加载的时候白屏时间过长，影响用户体验，下图为未经任何优化直接npm run build之后的情况： 其中vendor.js文件高达1.16MB，平均白屏时间超过10秒。 解决方案 使用CDN剥离JS ...
分类：
Web程序 时间：
2020-04-23 19:12:26
阅读次数：
151
4.23 --我现在使用的现成的框架已经相对完美了，为了加深理解，自己想搞一套本来想搭建一个最原生的react框架，但是最近开始忙活了，先给下简单的webpack配置说明给大家看看，参考。（后续有时间补上完整的项目） 说下要考虑到的需求： 使用ES6语言 使用React框架 自动生成HTML web ...
分类：
Web程序 时间：
2020-04-23 18:59:06
阅读次数：
117
（1）整体配置 entry：配置入口文件的地址，可以是单一入口，也可以是多入口。 output：配置出口文件的地址，在webpack2.X版本后，支持多出口配置。 module：配置模块，主要是解析CSS和图片转换压缩等功能。 plugins：配置插件，根据你的需要配置不同功能的插件。 devSer ...
分类：
Web程序 时间：
2020-04-23 12:31:53
阅读次数：
73
在内存中生成index.html页面 在前面的内容中我们已经知道了如何在内存中打包main.js并引入到页面中。 同样的，我们也可以把index.html也打包放入到内存中。 安装html webpack plugin插件 1. 2. 在webpack.config.js中 3. 重启服务 即可 为 ...
分类：
Web程序 时间：
2020-04-23 00:28:17
阅读次数：
60
Node npm 包管理工具：可下载jquery/bootstrap/vue/webpack等 npm管理项目 ? npm init y ? npm install xxx@0.0.0 ? npm uninstall xxx ? npm i 下载package.json所有的依赖 webpack打包 ...
分类：
其他好文 时间：
2020-04-22 19:42:26
阅读次数：
166
