草庐IT

webpack-handlebars-loader

全部标签

用webpack做一些前端打包时的性能优化

一.webpack的五个核心概念1.Entry:入口指示,webpack以哪个文件为入口起点开始打包,分析构建内部依赖图2.output:输出指示,webpack打包后的资源bundles输出到哪里去,以及如何命名3.loader:loader让webpack能够去处翻译理那些非js文件(imgcss…)4.Plugins:Plugins插件可以用于执行范围更广的任务,打包优化和压缩等…5.Mode:模式1.development开发模式:能够让代码本地调试运行的环境自动启用的一些插件会将process.env.NODE_ENV的值设为development启用NamedChunksPLugi

Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.

TypeError:Cannotreadproperty'props'ofundefined[Vuewarn]:Failedtoresolveasynccomponent:function(resolve)遇到以上三种问题,在我的项目中都归结为一个:就是依赖的sass-loader没有,或者说是依赖的node-sass没有所以解决办法就是//安装node-sassnpminode-sass-D//安装sass-loadernpmisass-loader-D在package.json查看 { "devDependencies":{  "node-sass":"^9.0.0",  "sass-lo

Vue 高德地图(@amap/amap-jsapi-loader)的基本使用:添加标记、POI关键字搜索、路线规划...(方法一)

高德地图的基本事件与使用前言:引入并初始化渲染地图1、初始化地图2、地图鼠标点击事件3、添加标记、移除标记点4、搜索服务——POI关键字搜索[AMap.PlaceSearch]5、驾车路线规划服务5.1可拖拽驾车路线规划[AMap.DragRoute]5.2途经点(起点终点途经点)路线规划[AMap.Driving]5.3位置经纬度+获取驾车规划数据[AMap.Driving]5.4规划结果+驾车路线绘制[AMap.Driving]完整代码:前言:引入并初始化渲染地图具体的步骤可以参考我的上一篇博客,有详细说明如何注册申请高德的Key、秘钥,初始化地图等等vue-amap:vue-amap基于

记录安装cnpm报错:internal/modules/cjs/loader.js:1032 throw err;

安装cnpm时一直安装无报错但是查看版本时提示错误:无法安装可以这样解决:解决安装卡顿或无法安装:#注册模块镜像npmsetregistryhttps://registry.npm.taobao.org//node-gyp编译依赖的node源码镜像npmsetdisturlhttps://npm.taobao.org/dist//清空缓存npmcacheclean--force//安装cnpmnpminstall-gcnpm--registry=https://registry.npm.taobao.org查看版本报错安装不成功解决:是npm和cnpm版本不匹配导致的一:查看当前npm版本np

做法一: vue-cli(webpack)配置开发环境、测试环境、生产环境

场景描述:      由于开发环境、测试环境、生产环境三者是放在不同的服务器导致请求的接口URL地址不同,所有需要配置根据不同的环境使用不同的服务器地址。解决问题:请先简单阅读一下官方文档,了解一下概念1、根目录创建.env.development、.env.test、.env.production文件(开发、测试、生产) 2、文件内容及字段说明NODE_ENV:可以设置为其他值,比如"test",但是打包后的目录结构和"production"不一样,所以还是设置为"production",通过"VUE_APP_MODE"变量来区分环境VUE_APP_MODE:线上测试环境VUE_APP_AP

mac 安装cnpm报错internal/modules/cjs/loader.js:905

mac安装cnpm报错internal/modules/cjs/loader.js:905throwerr;^Error:Cannotfindmodule'node:util'错误复现:安装cnpmnpminstall-gcnpm运行cnpmcnpm报错如下internal/modules/cjs/loader.js:905throwerr;^Error:Cannotfindmodule'node:util'Requirestack:-/Users/xxx/.nvm/versions/node/v14.17.3/lib/node_modules/cnpm/bin/cnpmatFunction.

使用Vulkan-Loader将ncnn代码改成Dynamic Loader Vulkan的形式

原本你写的程序是静态链接的系统的vulkan-1.dll,如果系统不存在vulkan-1.dll,则会直接崩溃。关于将ncnn静态链接vulkan改成动态加载vulkan的形式,然后提供这两个函数boolncnn::has_vulkan();voidncnn::use_vulkan(bool);请教过ncnn的作者nihui,她对此issue表示不以为意,没有必要,优先级不高。那就只有自己动手丰衣足食了。本文的目标是将其改为动态加载的方式,用到了KhronosGroup组织下的Vulkan-SDK里面的CPP部分,即vulkan.hpp本人的上一篇文章(https://www.cnblogs.

yarn create vite的时候,报错:SyntaxError: Unexpected token ‘.‘ at Loader.moduleStrategy (internal/modules/

 原因:如果和我一样的话那就是node的版本问题,由于我的工作中项目是需要node.js版本等级不能太高,而在使用yarn创建vite的项目时,node.js的版本又不能太低.最终我找到了一个最合适的版本.(不高不低刚刚好):V16.15.1.如果你所有的版本都试过了,但是找不到正好适应两者的版本,那么可以用以下方法来回切换,只需要在下载Node版本之前不删除之前的版本即可.以下我给出了下载与切换node版本的方法.解决:更换node.js版本node.js版本降级或者升级先下载nvm修改nvm下载的地址(防止下载Node.js速度过慢,一直加载)配置下载源为了加快node.js和npm的下载

webpack基本的配置

现在的前端,出现很多种可以提高开发效率的工具和框架,但是源码却不能直接运行,只有通过转换之后才能正常运行。那么构建就是把源码转化为可以执行的JavaScript、HTML和CSS代码。构建包含:代码转换【比如typescript编译为JavaScript,scss编译为CSS】;文件优化,比如压缩JavaScript,压缩合成图片;代码分割,提取公共代码,提取首页不需要执行的代码让它异步加载;模块合并,把模块分类合并成一个文件;自动刷新,监听本地源码的变化,自动重新构建、刷新浏览器;代码校验自动发布。基础webpackwebpack是一个打包模块化JavaScript的工具,通过loader转

Java HotSpot(TM) 64-Bit Server VM warning: Sharing is only supported for boot loader classes解决方法

1、问题翻译:JavaHotSpot(TM)64位服务器虚拟机警告:共享仅支持引导加载程序类,因为已附加引导程序类路径2、IDEA解决方法IDEA中—>file—>Settings—>Buinde—>AsyncStackTraces—>Instrumenting...