浏览模式: 标准 | 列表分类:Javascript
Submitted by gouki on 2023, June 13, 11:58 PM
js 真是一个有意思的东西。node_modules 到处可见，而且目录还特别在，然后 node 12\14\16\18，现在都快20了。
于是就会出现一个情况，磁盘里有 N 个 JS 项目，各自基于不同的 node 版本。当然 node 有 n / nvm 等相应的工具。直接运行就可以切换相应的版本。但如果你想同时开发两个不同版本的项目，就有点麻烦了。这边目录先 n 18，然后 npm run ，再回到另一个目录 n 16 && npm run 。看起来没问题，各自都能跑。
可是如果现在 n18的项目需要杀进程重启。那就得再运行 n18，恢复成18，然后再 run .....
不是说其他语言没有这种情况，比如 PHP，其实也有很多版本，还有 Python。但 PHP 可以通过安装不同的 php 版本，再使用 nginx 进行反代就完事了。python 也有 virtualenv。而 JS 居然没有。
搜了下网络，突然发现了 nodeenv。居然是利用 virtualenv 的方法来维护多版本。nodeenv 的安装我就不细说了：pip install nodeenv 就行了。
在相应的目录下，运行一下：nodeenv --node=16.xx.x --with-npm {dir}。这样一个简单的方法就在 dir 目录下生成了一个环境版本。然后运行 . ./dir/env/active ，会发现命令行前面多了个括号(env) <---根据目录名来。
在这个目录下面，直接运行 node -v，你会发现这个目录下的 node 就是你刚才指定安装的版本。也因为是--with-npm，所以 npm run 就直接可用了。
一切就是这样的自然。
当然也不是没有缺点，比如，这个 env的目录会很大，毕竟一个 node / npm，都在里面。但，至少可以解决问题了
Javascript | 评论:0
| 阅读:3370
Submitted by gouki on 2023, May 17, 8:44 AM
在使用 exceljs 进行导出的时候 。如果是全部自己写的代码那控制起来会比较方便。你 mergeCell 或者 splitRow，都没什么大问题，但要注意几点
1、时刻观察：worksheet._merges，因为在 mergeCell 的时候 已经合并过的表，是不能再次被合并的。会报错，这时候 可以用 getCell().model，看看是不是 master。如果是的话，可以先 unMergeSells()
2、在 mergeCells后，如果你有 insertRows 等类似的操作。只要影响到刚才 merge 过的单元格时，原来所有的 merge 都会被清空，这点要注意。
3、worksheet 可以设置冻结行和列，直接通过 worksheet.views，就可以定义 state:frozen，定义好左上角开始的坐标，然后定义 xSplit 和 ySplit 就行了。
更多的使用方法，还是看官方吧：https://github.com/exceljs/exceljs/blob/master/README_zh.md
Javascript | 评论:0
| 阅读:3290
Submitted by gouki on 2023, March 22, 1:30 PM
在使用webpack或者vue-service-cli 的时候，启动时出现：“0308010c:digital envelope routines::unsupported” 的错误，这时候应该怎么解决呢？
这个错误的原因可能有两个：
1、 你没有使用 Node JS 的 LTS（长期支持）版本或者是版本太新了。我现在我使用的是 Node 18.0.0。所以我直接npm -g add n ，安装了一个多版本的管理工具，切到16后正常了
2、将 --openssl-legacy-provider 传递给 Webpack 或 CLI 工具 例如，在 React 应用程序中，你可以将 --openssl-legacy-provider 传递给启动脚本，如 "react-scripts --openssl-legacy-provider start"。
2是网上查的资料，因为我1就直接解决了，所以2没用上，如果你方法1没有解决问题，那可以尝试方法2
Javascript | 评论:0
| 阅读:3740
Submitted by gouki on 2023, March 15, 10:01 AM
虽然已经知道所谓的：在vue中，两个不同的组件，A加了层级或者A的子元素加了层级（大于1），B没加，不管B的子元素层级有多高都不会再A上面显示。
但发现不管怎么调整，下拉框还是被其他组件覆盖了，这时候我才注意到有一个sticky的样式。为了让这个元素能够留在顶部，结果就出现了样式穿透的问题了。记录一下下次再遇到的时候，也好加深一下记忆
参考：
1、https://www.zhangxinxu.com/wordpress/2018/12/css-position-sticky/ ，杀了个回马枪，还是说说position:sticky吧
Javascript | 评论:0
| 阅读:4462
Submitted by gouki on 2023, January 7, 10:36 AM
require这玩意不属于vite的功能，也不是vue的功能，我没有用webpack，所以无法直接用require。
但因为参考的项目用了require.context的遍历，所以就在想应该怎么弄呢。查了一下资料，发现vite有提供现成的：import.meta.glob，用法和 require.context差不多。
原来的代码： const requireModules = require.context('./modules/', true, /index\.(ts|js)$/iu)
修改后的代码：const requireModules = import.meta.glob('./modules/*/index.(ts|js)')
只是原来requireModules还是一个function，而修改后的是一个Object，因此遍历的代码就要再改一下，比如原来可以直接requireModules.keys()，现在只能用Object.keys(requireModules)。
至此，修改完毕。
Javascript | 评论:0
| 阅读:3205
