为什么我一直不喜欢用模块化、工程化的现代化技术来做前端呢

第一因为自己技术力太弱
第二是 npm 的坑太多了

但即使是坑还是要踩的，不然真的永远都只能停留在用 jQuery 的地步，而现在都8102年了

起先搞出了 v1.0 后想着把设置的东西放到另一个文件上，以模块的形式加载过来，这样就可以不用更改主 js 文件里的东西了，也减少了一些莫名其妙的风险。然后……

这都8102年了，Chrome版本都69了，居然不支持 import 和 export？开什么玩笑…
有问题，找谷歌，然后有三个答案：

1. 对想要建立成模块的文件采用type="module"的方法
2. 使用动态的 import()
3. 使用 CommonJS 的 require 功能

在三种方式都尝试失败后，才想起来：Chrome 至今都10年了依然不支持完整的 ES6 语法。那就退回 ES5 吧，用 Babel

于是用 Babel 的话就得用 webpack 了，一直以来个人非常讨厌 webpack，原因就是：在国内的网络（Network）下 npm 总是安装失败，而且一拖 npm 弄了太多东西。不过坑还是要踩的

在谷歌的帮忙下终于配置好了 webpack 和 package。然后发现 webpack 根本没法初始化：

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.configuration.module has an unknown property 'loaders'. These properties are valid:

一看才知道，在 webpack 版本从2开始就已经不再支持 module 下用 loaders 了，而是采用了 rules 这个写法了。虽然有点坑，但还好顺利解决了。于是写完配置，cnpm install一下，然后平稳将1.0的东西放过来。然后编译（Compiler）一下就： [HMR] Hot Module Replacement is disabled了。一查少个配置少了个插件

     plugins: [
    new webpack.HotModuleReplacementPlugin()]

把这个配置加上去就稳了，但注意如果 plugins 下有其他插件的话，记得加逗号分隔开，虽说是个低级错误，但也遇到了几次

然后就想着别人的项目都是使用npm run start之类来部署运行的，而我这个只能用 webpack 命令打包后手动点链接，这也太没逼格了……

然而我并没有那技术力，于是再次请出谷歌，得知：

1. 先使用 npm install webpack-dev-server --save-dev 给自己的项目配置webpack 本地服务（Services）器
2. 修改 package.json 配置 script：

      "scripts": 
    {
      "start": "webpack-dev-server --env development",
      "build": "webpack --env production"
     }

这样就能在命令行（Command-line）中使用 npm run start 来自动打包编译并打开浏览器了。于是第三个坑也成功填掉

在这样一系列下来天亮了………

正好把 v2.0写完了传上 GitHub 了，也给自己的副站点使用了下，感觉还行……

webpack 在不会用的时候就感觉是魔鬼，但真的用了之后，真的很方便，难怪现在前端越来越讲究脚手架，越来越讲究模块化、工程化了。虽然 jQuery 制霸的时代已经过去了，但 jQuery 依然有其存在的必要性。各种新技术的冲击下只会一个 jQuery 已经无法适应现在了 何况你也没多会 jQuery。
感谢谷歌，节省了不少时间，也不用去傻乎乎当伸手党了，这种基础（Base）的东西，还是让不会给你脸色看的搜索引（Index）擎包了吧，搜索引擎不会跟你耍脸色……

想想看接下来，应该会把这个项目的代码优化下，以及提高下可编辑性，不过都做到这地步了，为什么不用 Vue 或者 React 重写呢……

因为我真的忘了学，学了忘啊…