wecbpack
巷陌540
这个作者很懒,什么都没留下…
展开
-
webpack5 搭建svg环境
webpack5搭建svg环境 svg 是矢量图。使用svg画的图片,不会怎么放大,都不失真 1: svg 可以通过 img标签加载 2: svg 可以作为字体图标 3: svg 可以用在大屏可视化上 做各种标记点。 进阶:将svg 做成 icon 组件,并使用webpack 搭建环境 … 编辑中… 开发实例代码如下 // user.svg <svg verison="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24"原创 2021-07-22 23:14:54 · 620 阅读 · 0 评论 -
webpack 搭建ts环境
webpack 搭建ts环境 ts 需要在typesctipt 运行 ts 运行过程: ts_–>编译为js文件—>运行js 1: 安装依赖 typescript 是ts的运行环境,将ts编译为 js文件 awesome-typescript-loader 是webpack 将 ts 语法 变为 js html-webpack-plugin webpack webpack-cli 2: 创建webpack.config.js文件 初始化文原创 2021-07-22 23:14:15 · 183 阅读 · 0 评论 -
webpack搭建scss环境
webpack搭建scss环境 1 scss 运行环境 node-sass scss 文件需要在node平台运行,node-sass sass 是 scss sass的运行平台 2 安装依赖 node-sass sass-loader 加载 Sass/SCSS 文件并将他们编译为 CS css-loader 解析模块要的 css @import … mini-css-extract-plugin原创 2021-07-22 23:13:37 · 404 阅读 · 0 评论 -
webpack 搭建 less 环境
webpack 搭建 less 环境 1安装依赖 less less 的运行环境 less-loader 将less编译为 css 的loader css-loader 让js解析css代码 mport/require() style-loader 把css插入到dom中 mini-css-extract-plugin 将css离去单独的文件 ht原创 2021-07-22 23:12:53 · 224 阅读 · 0 评论 -
webpack5 实现devserve自动化打包
webpack-dev-server 需求 1: 通过一个 命令 运行打包后代码。代替手动运行 2: 开发者编写的代码更新时,自动打包。并且自动运行 安装 webpack-dev-server 配置 devServer module.exports = { devServer: { contentBase: path.join(__dirname, 'dist'), compress: true, port: 9000, ope原创 2021-07-22 23:10:47 · 194 阅读 · 0 评论 -
初始webpack
1为什么会webpack 1 因为开发者编写的代码是模块化开发,.less .scss .vue .js等文件 2 开发者编写的代码是工程化 因为浏览器不能解析vue react less scss 等工程化模块化的代码,所以需要webpack 工具,将编写的模块化代码,进行编译/打包,然后在浏览器中运行的编译后或者打包后的代码 编译:由A变B 就是编译 打包:将代码放到一个文件中,这些代码可能被重新压缩了 2webpack是什么? webpack 是自动化构建工具 3:怎么搭建使用webpack的原创 2021-07-22 23:05:21 · 74 阅读 · 0 评论