-
ES6模块化通过import和export实现代码复用，支持静态分析、循环依赖处理和浏览器原生支持，优于CommonJS与AMD；提供命名导出与默认导出两种方式，适用于多成员暴露或单个主要实体导出场景；支持动态导入和import.meta等高级特性，可在浏览器中通过type="module"使用，需注意兼容性与CORS问题；结合TypeScript可提升类型安全与项目可维护性。
-
class冲突难排查是因为CSS全局作用域导致同名类被覆盖且无报错；BEM通过命名隔离作用域，禁止跨Block复用；渐进式落地需新功能强制BEM、老模块加scope隔离；须警惕过度嵌套与语义膨胀。
-
浮动导致父容器高度塌陷的根本原因是浮动元素脱离文档流，修复方法包括clearfix、overflow:hidden，但推荐改用flex或grid布局。
-
答案是使用JavaScript控制CSS类或CSS变量切换主题，并结合localStorage持久化。通过定义:root变量或主题类，动态修改属性或class实现样式切换，页面加载时从localStorage读取并应用用户偏好，确保主题持久生效。
-
padding导致内容溢出是因为box-sizing默认为content-box，此时width/height不包含padding，使总尺寸超出容器；改用border-box可解决，但需先确认是否为盒模型问题而非布局、文本流或渲染层原因。
-
HTML拼接有五种方法：一、JavaScript动态加载，用fetch+DOMParser插入；二、Node.js服务端拼接，用fs读取并合并字符串；三、HTMLImports（已废弃）；四、模板引擎如EJS通过include引入；五、Webpack等构建工具插件编译时内联。
-
Webpack适合复杂前端应用，支持多模块格式与资源处理，提供灵活的代码分割和运行时加载机制；2.Rollup专注ESModule，通过静态分析实现高效TreeShaking，生成简洁代码，更适合打包JavaScript库；3.选型应基于项目类型，应用开发优选Webpack，库开发首选Rollup。
-
在Cypress中测试使用Pinia的Vue组件时，若未正确注入Pinia实例，会触发getActivePiniawascalledwithnoactivePinia错误；根本原因是组件挂载上下文与Pinia实例未建立关联。
-
使用left:50%和transform:translateX(-50%)可让绝对定位元素在页面底部水平居中，适用于任何宽度；或通过设置固定width配合left:0、right:0与margin:0auto实现居中；若父容器可控，采用display:flex、justify-content:center和align-items:flex-end更简洁。推荐首选第一种方法，兼容性好且无需固定宽度。
-
JavaScript中return返回undefined的根本原因在于：XMLHttpRequest是异步操作，函数在响应到达前已执行完毕并返回，此时回调中赋值的变量尚未生效。必须通过Promise/async-await或同步请求（不推荐）来确保获取真实响应。
-
reduce是处理数组累积逻辑最直接的工具；关键在明确初始值与累加器类型匹配，避免空数组报错、类型不一致、异步误用及漏写return等常见错误。
-
<style>必须放在<head>里，放<body>中会导致渲染闪动或被忽略；支持全部CSS语法但禁用@import；仅适用于单页特有样式，非性能优化手段。
-
ES6是JavaScript第6版标准（ECMAScript2015），补齐语法、对象模型与异步能力；let/const提供块级作用域与赋值约束；箭头函数简化this但无自身this/arguments；解构与模板字符串提升可读性；Promise与async/await解决回调地狱。
-
大屏下按钮栏浮动定位失效因fixed在iOSSafari中遇transform等会降级为absolute；小屏底部固定被键盘顶起需动态切换absolute并计算安全距离；响应式布局需按屏幕尺寸调整排列与样式。
-
用CSS骨架屏加载效果的核心是渐变背景+位移动画：1.用语义化空元素占位并设浅灰底色和圆角；2.线性渐变创建亮色条带，配合background-size和background-position实现扫描光效；3.通过@keyframes让背景位置水平移动，时长1.5~2s，infinite循环；4.优化细节如头像溢出隐藏、文字间距、按钮尺寸及动画错峰。
