lang | title | description |
---|---|---|
zh-CN |
收集 |
收集好玩的 |
前端个人积累 🎉
一加一等于 {{1+1}}
span: {{ i }}
这是默认主题内置的 <Badge />
组件
[[toc]]
- 学习 sass
- 学习 TypeScript
- 学习 redis
- webpack4.0 + vue
- Vue 源码分析
- Vue 技术揭秘
- CreateJS 是基于 HTML5 开发的一套模块化的库和工具
- vue-test-utils
- Vue 组件的单元测试
- Vue SSR 指南
- Nuxt.js
- 从 vue-cli 源码学习如何写模板
- 面试经验
- JavaScript 开发者应懂的 33 个概念
- 面试问题
- 开源 books
- [] react 源码
- [] ts
- [] make games
- [] storybook
- [] vue3.0
- [] 手写面试
- [] BEM 命名法
- Vue3 入门指南,与实战案例
- [] web 全栈体系博客
- [] Markdown教程
- [] emoji-cheat-sheet
-
很多图片链接设置了防盗链机制,从我的网站请求图片会返回 403 错误,但直接在浏览器中打开图片的 url 时却又正常。
-
前端
-
vue 常用组件
- Vue 源码分析
- Vue 技术揭秘
- 引导提示框 vue-introjs
- 数字动画跳动 vue-countup-v2
- Vue 的 video.js 播放器组件vue-video-player
- [better-scroll] (http://ustbhuangyi.github.io/better-scroll/)
-
工具
-
教程
__dirname
:全局变量,存储的是代码所在文件的所在的文件目录__filename
:全局变量,存储的是代码所在文件的文件名
// /work/coding/githubbuild/my-bfe-awesome/test.js
console.log(__dirname);
// /work/coding/githubbuild/my-bfe-awesome
console.log(__filename);
// /work/coding/githubbuild/my-bfe-awesome/test.js
- 生成 html 的插件 https://github.com/ampedandwired/html-webpack-plugin 配置
new HtmlWebpackPlugin({
filename: path.resolve(config.build.assetsRoot, 'index.html'), // 生成的html的文件名
template: 'index.html', // 依据的模板
inject: true, // 注入的js文件将会被放在body标签中,当值为'head'时,将被放在head标签中
minify: { // 压缩配置
removeComments: true, // 删除html中的注释代码
collapseWhitespace: true, // 删除html中的空白符
removeAttributeQuotes: true, // 删除html元素中属性的引号
minifyJS: {
compress: {
warnings: false
}
},
// 更多配置
// https://github.com/kangax/html-minifier#options-quick-reference
},
chunksSortMode: 'dependency' // 按dependency的顺序引入
}
- velocity.js 支持链式调用
- gsap GSAP 是一个 JavaScript 库,用于创建适用于所有主流浏览器的高性能动画
- tweenjs TweenJS 类库主要用来调整和动画 HTML5 和 Javascript 属性,提供了简单并且强大的 tweening 接口。
- hilo 阿里的 HTML5 互动游戏引擎
- pixijs PixiJS 是一个超快的 2D 渲染游戏引擎。它自动侦测使用 WebGL 或者 Canvas。
- Kaboom.js Kaboom 是一个 JavaScript 库,可帮助您快速有趣地制作游戏.
- Valine 一款快速、简洁且高效的无后端评论系统。
- 基于 UI 组件的 Vue 可视化布局工具
- 正则表达式测试网址
- 用户指引库
- 腾讯蓝鲸
npm install pm2 -g
// 进程间通信模块保证日志正常打印 pm2 安装模块依赖 git
pm2 install pm2-intercom
// package.json 里 scripts 的配置
"pm2": "pm2 start ./config/ecosystem.config.js --env production",
// config/ecosystem.config.js
module.exports = {
/**
* Application configuration section
* http://pm2.keymetrics.io/docs/usage/application-declaration/
*/
apps: [
// First application
{
name: "",
script: "./bin/www",
watch: true,
ignore_watch: [
// 从监控目录中排除
"node_modules",
"logs",
"public",
".idea",
".git",
],
watch_options: {
followSymlinks: false,
},
error_file: "./logs/pm2/app-err.log", // 错误日志路径
out_file: "./logs/pm2/app-out.log", // 普通日志路径
instances: 2,
// instance_var: "NODE_APP_INSTANCE",
exec_mode: "cluster", // 集群模式 负载均衡
env: {
COMMON_VARIABLE: "true",
},
env_production: {
NODE_ENV: "production",
},
env_dev: {
NODE_ENV: "dev",
},
env_test: {
NODE_ENV: "test",
},
},
],
};
字符串模版 折行转义字符
var htmlSTring =
"<div>\
This is a string.\
</div>";
http://[fe80::461c:a8ff:fe2a:accf%2]:3911/1ed680d5-6138-4608-a269-8840850a96f9