panpan0329-CSDN博客

原创从零实现聊天输入框 TextEditor

TextEditor:简介整体思路Manage State需要监听的事件基本计算Insert:InsertText()InsertMention()InsertLineBreak()Remove:RemoveTextBackwards()RemoveTextForwards()获取&调整 selectionSelectAll反选设置光标：emit SearchUser其他简介整体思路将 editor 元素设置为 contentEditable = true监听 editor 元素上的事件

2020-11-19 17:06:41 380

原创【webpack】- 3 - Entry

Entry入口文件，也就是从哪个文件开始进行依赖分析并打包在 webpack v5 中，默认为 entry: './src/index.js'单入口应用：打包生成一个 chunk，输出一个 bundle 文件可以直接使用： entry: './src/index.js'如果要修改输出的 filename：通过 input 的 key-value 设置，但是需要 output 中设置的 filename 为 [name].js，否则以 output 中设置为准en

2020-07-08 19:17:06 128

原创【webpack】- 2 - 安装和使用

安装和使用安装：需要安装 webpack webpack-cli全局安装 -g：所有项目共用同一个版本的 webpack本地安装 -D：在当前项目目录下安装，可以让不同的项目使用不同版本的 webpack推荐本地安装而不使用全局安装运行时，使用 npx webpack -v 就会从当前项目目录下的 node_modules 中查找 webpack 并运行npm scripts里面也是先在当前目录下寻找 webpack，类似 npx webpackwebpack-cli：让我们能在命

2020-07-08 19:16:42 135

原创【webpack】- 1 - 简介

Webpack 简介Webpack 是什么定义摘抄自官网：https://webpack.js.org/concepts/https://www.webpackjs.com/concepts/At its core, webpack is a static module bundler for modern JavaScript applications本质上，webpack 是一个现代 JavaScript 应用程序的静态模块打包器为什么要打包当我们写代码时，可能会使用不同的框架

2020-07-08 19:16:17 104

原创【服务端渲染】Next.js 学习笔记

Next.js 学习基于React的服务器端渲染框架特点：默认服务端渲染，以文件系统为基础的客户端路由，没有路由配置文件代码自动分割使页面加载更快使用 ES6 module对 SEO 友好，提升手机及低功耗设备的性能，快速显示首页文件系统的路由：创建 ./pages 文件夹，该文件夹只能存放页面级别的组件默认访问 pages/index.js 文件，其他的页面需要通过...

2020-04-05 00:22:05 221

原创【前端工程化】- 2 -VSCode插件

2 - VSCode 插件如果使用好了 VSCode 插件，可以让写代码时不仅美观统一，还能帮助避免一些常见错误。这里列举了一些目前觉得好用的 VSCode 插件，以供参考。代码检查和美化：1. ESLint主要针对 JS & JSX，非常心水它的美化代码和 Auto Fix on Save，同时也可以在 .eslintrc.js 中配置一些规则，让代码统一、规范，比如每个函数的...

2020-03-31 00:14:10 208

原创【前端工程化】- 1 - 前端模块化

1. 前端模块化将系统分离成独立功能部分的方法。侧重点包括模块的定义，依赖和导出。优点每个模块有自己独立的焦点和目的方便模块之间的组合和分解方便单个功能的调试方便多人协作，互不干扰工具1. Webpack网址：https://webpack.js.org基本介绍：将源代码打包成可以直接发布上线的静态资源的打包工具。将代码进行分隔，可以实现按需异步加载通过 Lo...

2020-03-29 19:11:22 200

原创【前端工程化】- 0 - Introduction

0 - Introduction前端工程化有助于：将大型项目或复杂功能进行拆分实现模块化、组件化：可以提高复用性，更方便维护，尤其是多人协作的情况下提高项目的开发质量减少重复性的工作前端工程化涉及方面：模块化：进行资源管理，常见：npm, webpack, parcel, rollup详细笔记：Link组件化：提高组件的复用性和可维护性详细笔记：Link规...

2020-03-29 19:10:44 94

panpan0329的博客