草庐IT

webpack-cli

全部标签

webpack plugin源码解析(六) CompressionWebpackPlugin

文章目录作用涉及webpackAPI处理asset钩子compilation.hooks.processAssets返回或新建缓存:compilation.getCache返回asset文件信息:compilation.getAsset文件名匹配函数:compiler.webpack.ModuleFilenameHelpers.matchObject模版字符串替换:compilation.getPath实现constructorapply生成输出压缩文件作用压缩打包后的文件,可以配置是否删除源文件constCompressionPlugin=require("compression-webpa

基于 Webpack5 Module Federation 的业务解耦实践

我们是袋鼠云数栈UED团队,致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神,探索前端道路,为社区积累并传播经验价值。本文作者:贝儿前言本文中会提到很多目前数栈中使用的特定名词,统一做下解释描述dt-common:每个子产品都会引入的公共包(类似NPM包)AppMenus:在子产品中快速进入到其他子产品的导航栏,统一维护在dt-common中,子产品从dt-common中引入Portal:所有子产品的统一入口APP_CONF:子产品的一些配置信息存放背景由于迭代中,我们有很多需求都是针对AppMenus的,这些需求的生效需要各个子产品的配合,进行统一变更。现在的数栈前端的项目当中,Ap

vue-cli 5 如何配置 CSS Modules

折腾了半天,发现根本不用安装什么stylus、stylus、style-loader、css-loader什么东东一大堆!!!直接创建css文件然后引入就可以了,需要配置的话可以在css.loaderOptions配置,默认不配置就可以,真的我哭死!!!1.新建文件img.custom-module.css/*img.custom-module.css*/.img-w200{width:200px;height:200px;}:local(.img-full){width:100%;height:auto;}2.在vue文件中可以import引入//IndexPage.vueimportsty

node 安装 ,淘宝镜像配置,webpack 安装

node 安装1.下载下载|Node.js中文网 2.选择和安装根据自己的操作系统选择下载安装,安装只需要下一步,下一步就可以了;(注意电脑使用习惯,尽量别安装到C盘,选择一个自己的盘符安装各种软件和环境)3.安装完毕,查看版本和切换淘宝镜像  (1) 按 win+r  =输入cmd =出现命令行界面  =输入 node-v  =出现v14.0.0 (这里是你安装的版本)  这里的操作证明你node安装成功了(2)查看自己安使用的镜像地址并切换淘宝镜像  npmconfiggetregistry     https://registry.npmjs.org/ 这是国外镜像地址,有时候会比较慢,

webpack,从弹出的Angular CLI应用程序中删除注释不起作用

我有一个弹出的AngularCLI应用程序,该应用程序会发表评论“无论如何我对uglifyjs设置做什么。我遵循了这里,这里和各个地方,但似乎都没有用。我不确定在插件顺序中,我应该放置uglifyjsplugin。我尝试在第一个位置,最后一个位置,第二位置以及同时在其他所有位置上尝试。在其他插件中是否有一些干扰的设置?我在窗口上运行此操作"build:prod":"setNODE_ENV=production&&webpack--defineprocess.env.NODE_ENV=\"'production'\""/*eslint-disablenode/no-unpublished-req

webpack5基础使用(1)-介绍、打包文件、处理样式资源(css、less)文件、配置文件内容、eslint工具检测语法、babel工具es6语法转es5

文章目录webpack5基础1、webpack5简介2、webpack5大核心概念3、打包js文件创建文件下载依赖启用webpack打包结果使用4、webpack配置文件webpack.config.js5、webpack处理样式资源5.1处理css样式资源5.2处理less样式资源5.3处理图片资源6、修改输出文件目录7、自动清空上次打包资源8、处理js资源8.1eslint使用8.2babel使用9、开发环境下自动打包好html资源10、开发环境下自动更新打包数据文件webpack5基础1、webpack5简介webpack5是一个静态资源打包工具。会以一个或多个文件作为打包的入口,将整个

2.Redis下载安装配置(Windows、Linux、Ubuntu)、Redis-cli(客户端)基本命令、Redis可视化工具(Redis Desktop Manager)

目录什么是缓存?为什么要使用缓存?1.Redis基本介绍(NoSQL)2.Redis下载安装配置(Windows、Linux、Ubuntu)、Redis-cli(客户端)基本命令、Redis可视化工具(RedisDesktopManager)3.Redis数据类型及其操作命令4.Redis安全(创建用户)、数据备份与恢复、管道技术、分区5.RedisHyperLogLog、发布订阅、事务、脚本、服务器命令6.基本使用Redis(key-value,键值对)7.传统Spring中使用Redis8.SpringBoot中使用Redis9.Redis主从复制(Master/Slave)10.Reid

完美解决 Error: Cannot find module ‘@vue/cli-plugin-eslint‘ 报错

internal/modules/cjs/loader.js:985throwerr;^Error:Cannotfindmodule'@vue/cli-plugin-eslint'Requirestack:-C:\Users\lenovo\AppData\Roaming\npm\node_modules\@vue\cli-service\lib\Service.js-C:\Users\lenovo\AppData\Roaming\npm\node_modules\@vue\cli-service\bin\vue-cli-service.jsatFunction.Module._resolveF

webpack:无法构建正确的字体路径

我有一个vue.js项目-我使用了webpack模板。我们有自定义字体。我在SCSS中引用了它们,如下所示:$font-path:'~@/assets/fonts/';@font-face{font-family:'someFont';src:url('./#{$font-path}someFont/someFont.eot')format('eot'),url('./#{$font-path}someFont/someFont.woff2')format('woff2'),url('./#{$font-path}someFont/someFont.woff')format('woff'),u

android - 你如何强制使用 cordova-cli 构建的移动应用程序横向?

我正在使用cordovacli构建我的应用程序。我想同时针对android和ios(也许更多)。因为我希望这对所有平台都是正确的,所以我希望我可以像这样在config.xml中简单地将其定义为首选项:因为这显然是howitworks在phonegap版本中https://build.phonegap.com/docs/config-xml我假设phonegapbuild在config.xml中支持的功能与cordova-cli支持的功能不同?我知道我可以通过将android:screenOrientation="landscape"插入到我的AndroidManifest.xml中来在