程序猿日常

2019/2/26

• import、require、export、module.exports使用详解

webpack本身维护一套模块系统，这套模块系统兼容了前端历史进程下的模块规范，包括amd,commonjs,es6等，本文主要针对 commonjs和es6规范进行说明。模块化的实现其实就是在最后编译的文件内。自执行函数：

(function(modules){  
    
})([])

自执行函数的入参是个数组，这个数组包含了所有的模块，自执行函数体里的逻辑就是处理模块的逻辑。

babel专门用于处理es6转换为es5，当然也包括es6模块语法的转换。
babel和webpack的转换思路差不多，区别在于webpack的原生转换可以多做一步静态，分析，使用tree-shaking技术 babel能提前将es6的import等模块关键字转换为commonjs的规范。

es6的导出模块方法有：
 export default 123;
 export const a = 1;
 const b = 2;
 const c = 3;
 export {b, c};

babel会将这些统统转换为commonjs的exprots。

exports.default = 123;
exports.a = 1;
exports.b = 2;
exports.c = 3;
exports._esModule = true;

babel将模块导出的逻辑非常简单，将所有的输出都赋值exports，并带上一个_esModule表明这个由es6转换来的commonjs输出。
对于最常见的

import a from './a.js'

在es6中这个行代码的本意是想去引入一个es6模块中的default输出。

• 修改Element-ui源码自动刷新配置方法：

import ElementUI from './../node_modules/element-ui/src/index.js';  
webpack.base.config.js文件修改babel-loader配置添加：
resolve('node_modules/element-ui')
"transform-vue-jsx",
"transform-es2015-modules-commonjs"都加上前缀babel-plugin-

1. css BFC IFC GFC FFC
2. css 常用的核心技巧
3. css 矩阵 css 3d
4. css 与数学魅力
5. css预处理器和后处理器
6. css性能问题 重绘重排 动画 硬件加速
7. css 与黑客安全 跨站脚本攻击
8. psd houdini

• 前端分图形化和架构师两个大方向
• nodejs要学习的重点

1. log4js
2. jmeter + js
3. PM2
4. Nginx配置
5. proxy io
6. promise
7. express koa2