Mark_fu博客

1-1 管理图片1、加载 npm install url-loader -D加载 npm install file-loader -D2、webpack.common.js 里面需要配置一下const path = require("path");const HtmlWebpackPlugin = require("html-webpack-plugin");const webpack = require("webpack");const { NamedModulesPlugin } =

1-1 开发环境和生成环境分离我们想把 开发环境和 生产环境 分开怎么去实现？1、新建几个文件2、安装两个插件1）用来合并 npm install webpack-merge -D2）用来清理旧的打包文件 npm install clean-webpack-plugin -D3、3-1 配置 webpack.common.jsconst path = require("path");const HtmlWebpackPlugin = require("html-webpack-

1-1 使用插件测试项目如果每次都需要在我们测试文件 index.html 更改打包的文件这个事情貌似显得有些麻烦每次都需要修改这个我们尝试利用插件解决这个问题1、首先删除 index.html2、下载 插件 npm install html-webpack-plugin -D3、然后可以看到 package.json 中有插件的版本等信息3、配置文件 引入 const HtmlWebpackPlugin = require("html-webpack-plugin")4、使用插

1-1 监听模式watch模式 真的开发不使用这个我们每次更改之后 都需要执行npm run dev这样不好 太繁琐了我们尝试简化这个事情打开事件监听模式 文件更改之后 自动进行打包1、2、2-1 webpack-dev-server1、下载 -D 表示在开发环境npm install webpack-dev-server -D2、package.json里面配置一下3、npm run server 可以实现自动打包或者 ./node_moduls/.bin/

1-1 认识一下webpack1、多个js 打包2、将重要的和不重要的分隔开3、预编译首先有个问题 vs code 创建文件夹的方式 是有些智障 这个地方还拦了我一下1-2 我们发现 使用 webpack 打包出现了很大的问题 ？(https://www.bilibili.com/video/BV1oK411p7SJ?p=3)一直打包后报错我们检查一下步骤1、vs code 里面新建一个目录 随便起 webdemo2、打开里面的终端定位到 webdemo 然后npm i