vue.js全家桶 读后感 整体感觉因为是带着问题阅读本书，基本感觉整本书都是在罗列非常具体的技术细节，缺少从更高维度看设计和框架性思考。并不是一个对前端新手友好的书。但这也不能否认讲到到一些vue基本知识。认真读后还是有一些收获。（也可能是因为是我找的第一本vue书籍）内容大概本书简单介绍vue环境和vue框架提供的一些关键特性，介绍了使用mock拦截请求来模拟服务器请求并实现了一个图书管理系统。这让我想起各种本科论文都是实现xxx系统的味道。当然也简单的写了项目webpack打包。收获vue就是一个前端框架，它的一切都跑在浏览器端。可配合element ui之类的库使用单页面应用的概念使用webpack进行js代码、png资源等等的打包，对.vue文件使用webpack的vue-loader插件。使用mock拦截自己本地请求，返回模拟的服务器数据。一些vue关键特性和加载流程图看了看豆瓣的连接，居然没有人评论，可见热度真不怎么好。https://book.douban.com/subject/35625681/

文件bom头 有关于BOM，是Windows程序处理文本是常用，但linux不常用。BOM 是 byte-order mark 的缩写，是 "字节序标记" 的意思, 它常被用来当做标识文件是以 UTF-8、UTF-16 或 UTF-32编码的标记。在 Unicode 编码中有一个叫做 "零宽度非换行空格" 的字符 ( ZERO WIDTH NO-BREAK SPACE ), 用字符 FEFF 来表示对于 UTF-16 ，如果接收到以 FEFF 开头的字节流， 就表明是大端字节序，如果接收到 FFFE， 就表明字节流 是小端字节序UTF-8 没有字节序问题，上述字符只是用来标识它是 UTF-8 文件，而不是用来说明字节顺序的。"零宽度非换行空格" 字符 的 UTF-8 编码是 EF BB BF, 所以如果接收到以 EF BB BF 开头的字节流，就知道这是UTF-8 文件关于文件16进制查看方法，在linux下可以用hexdump $path_to_file命令查，windows下也可以用vim打开后，使用%!xxd 命令，本质上是调用了xxd程序进行转化。windows下也可以用vs code插件，需要安装Hex Editor插件，然后在vscode打开对应文件名页签处右键调用客户端js代码下载函数如下，关键的是在数据前面增加了 FFFE 前缀，浏览器下载后会变更EF BB BF 开头。export function downloadExportUtf8Csv(url, fileName) { request({url: url, method: 'get'}).then(response => { let data = "\ufeff" + response.data let blob = new Blob([data], {type:'text/csv,charset=UTF-8'}) let url = window.URL.createObjectURL(blob) let a = document.createElement("a") a.href = url a.download = fileName a.click() window.URL.revokeObjectURL(url) a.remove() }) }后续在node_module中的客户端库，FileSaver中也有自动转码。auto_bom = function(blob) { // prepend BOM for UTF-8 XML and text/* types (including HTML) // note: your browser will automatically convert UTF-16 U+FEFF to EF BB BF if (/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(blob.type)) { return new Blob([String.fromCharCode(0xFEFF), blob], {type: blob.type}); } return blob; } FileSaver = function(blob, name, no_auto_bom) { if (!no_auto_bom) { blob = auto_bom(blob); } // ... }

npm常见操作 学习npm总给我一个熟悉感觉，基本上和学习C/C++的make工具一样。在make工具中，项目下一般有makefile文件，对应到npm也是一样。当执行npm init时,会生成一个package.js文件，这个文件描述当前项目信息。它定义了当在其他地方使用npm install安装本项目时需要安装什么依赖。另外也定义了支持哪些间接执行shell命令等等。这几乎就又是一个make工具。可能通过help查看他支持功能npm help npm 命令 --help总体上就是创建/安装/卸载/更新/锁定某个库包到项目中或者本机全局环境中。核心操作类似C的hello world,他的第1个重要的命令是npm init，作用是在当前目录创建一个package.js, 之后所有命令都是围绕在这个文件基本的操作。package.js文件包含一些重要字段：name: 表示包名version：表示版本entry point：表示入口文件，一般是传递给Node程序，相关于执行了node entry.jsscript：表示通过npm run xxx 中 xxx对应的npm或者shell命令dependencies/devDependencies: 当前项目依赖js库及其版本description/keywords/author/license：项目简介描述信息使用npm init -y后也可以再次设置一些项目配置信息npm config set init.author.name YOUR_NAME npm config set init.author.email YOUR_EMAIL 执行命令npm run [cmd]如果不指定cmd则会罗列出支持执行的命令(script字段配置中)包管理1、查看react包主页npm home react2、查react包信息npm info react3、安装包npm install 模块名[@版本] [--save/-S --save-dev/-D] [-g]可以用@指定版本，npm的版本分为大、次、小三个版本号，用.号分开，样式如3.4.1。 如果在版本号前使用^(接受次、小版本变化)、~(只接受小版本变动)、latest(最新版本)。package.json只会保存模糊版本，如果项目只能依赖某个具体版本时，package-lock.json因为会保存具体版本，所以也需要版本git/svn仓库管理。命令样式npm install bootstrap@3.3.7有另外一个不需要仓库管理package-lock.json文件的办法是，安装特定版本依赖包前用类似npm config set save-prefix='~'命令指定package.json保存允许小版本变动。如果完全不接受版本变化，则用npm config set save-exact true，然后在安装。模块包是区分生产、开发环境的--save/-S表示生产环境依赖的模块（会更新package.json中的dependencies字段）。同理也有--save-dev/-D参数更新到开发环境依赖模块。比如给开发环境安装eslint环境（js语法检查模块）命令就是npm install -D eslint。如果不指定是开发环境则默认是生产环境依赖。这个命令在把eslint模块安装在当前目录的node_modules目录下同时也会创建更新package-lock.json文件。如果需要在本机环境全局安装，则使用-g， 此时可以使用npm root -g查看具体是安装在哪里。或者使用npm list -g查看当前已经安装了哪些全局模块。一般node_modules目录是不需要进行版本管理的，使用npm install会自动下载模块。当不指定包时，就会从package.json文件自动下载所有依赖项到本地。4、查看已经安装包npm list|ls [-g] [模块名]如果有指定模块名时，只查指定模块如果此命令有UNMET DEPENDENCY不满足依赖时，需要重新生成本地包缓存。npm -fr node_modules/ # 删除已经安装模块 npm cache clean # 清理npm内部缓存 npm install # 重新安装5、查看远程最新版本npm view 模块名 [version]6、查看远程指定模块的所有版本npm view 模块名 versions7、卸载本地/全局模块npm uninstall [-g] 模块名8、搜索远程模块npm search 模块名9、更新本地/全局模块npm update [-g] 模块名10、安装项目所有依赖模块npm ci会删除node_modules，但不会更新package.json

nodejs环境配置 安装nodejs也会自动安装npm(nodejs 包管理器) 下载地址来源： https://nodejs.org/zh-cn/download 下载二进制安装包：wget https://nodejs.org/dist/v18.18.2/node-v18.18.2-linux-x64.tar.xz 安装指引：https://github.com/nodejs/help/wiki/Installation配置pathVERSION=v18.18.2 DISTRO=linux-x64 INSTALL_FILE=node-$VERSION-$DISTRO.tar.xz rm -fr $INSTALL_FILE wget https://nodejs.org/dist/$VERSION/$INSTALL_FILE sudo apt-get remove nodejs sudo apt-get remove npm sudo mkdir -p /usr/local/lib/nodejs sudo tar -xJvf $INSTALL_FILE -C /usr/local/lib/nodejs export PATH=/usr/local/lib/nodejs/node-$VERSION-$DISTRO/bin:$PATH验证node -v npm -v npx -v配置npm包全局安装路径>npm config get prefix /usr/local/lib/nodejs/node-v18.18.2-linux-x64 >mkdir /usr/local/lib/nodejs/node-v18.18.2-linux-x64/node_global >npm config set prefix /usr/local/lib/nodejs/node-v18.18.2-linux-x64/node_global >npm config get cache /home/ubuntu/.npm >mkdir /usr/local/lib/nodejs/node-v18.18.2-linux-x64/node_cache >npm config set cache /usr/local/lib/nodejs/node-v18.18.2-linux-x64/node_cache一些思考nodejs是一个js运行时环境，所以理论上讲npm管理的也是一些js库，但是npm又增加了一些其他支持，比如在分离项目环境配置时可以执行配置命令等。这些已经和Make工具既负责gcc调用又做其他可能完全还在这个范围的事情，即做责职内和外的事情。这虽然带来一些便利，但已经变得不纯粹了。非常的不unix设计。最近在看VUE.js书籍，甚至都不介绍Linux环境设计，可能就是为了给win用户使用😂