在 centOS 上安装 express、webpack、rollup

局部安装 express

Express基于 NodeJs 平台，快速、简洁的 Web 应用框架，为 Web 和移动应用程序提供一组强大的功能。中文：https://www.expressjs.com.cn

cd /var/web/www/exampleSSR

# 在项目中，安装 Express
npm install express -S# 在项目中，安装 TypeScript 依赖
npm install @types/express -D

node 无法直接运行 ts 文件，需要使用 ts-node。Express 是基于 node 环境的，所以还需要安装 node TypeScript 依赖。

cd /var/web/www/exampleSSR

# 在项目中，安装 ts-node
npm install ts-node -D# 在项目中，安装 TypeScript 依赖
npm install @types/node -D

查看已安装

npm list
npm list express
npm list ts-node

安装 webpack

Webpack 是一个前端资源的打包工具，它可以将js、image、css等资源当成一个模块进行打包。中文网站：https://www.webpackjs.com

webpack支持全局安装和本地安装，官方推荐是本地安装。进入项目目录安装：

cd /var/web/www/myapp

npm install webpack -D# webpack 4+ 版本，还需要安装 CLI：
npm install webpack-cli -D# 安装 webpack-dev-server
npm install webpack-dev-server -D

rollup

Rollup，是一个 JavaScript ESM 打包器，可以将小块代码编译成更大更复杂的代码，例如 library 或应用程序。与 Webpack 偏向于应用打包的定位不同，rollup.js 更专注于 Javascript 类库打包。中文网址：https://www.rollupjs.com

webpack 和 rollup 在不同场景下，都能发挥自身优势作用。webpack 和 rollup 比较：

• webpack 对于代码分割和静态资源导入有着“先天优势”，并且支持热模块替换（HMR），而 rollup 并不支持。所以当开发应用时可以优先选择 webpack。
• Rollup 是一款 ES Module 打包器，从作用来看，Rollup 与Webpack 很相似，但 Rollup 更为小巧，仅仅是一款ESM打包器；Rollup 中不不支持类似的热模块替换（HMR）这种高级特性。rollup 对于代码的 Tree-shaking 和 ES6 模块有着算法优势上的支持，若你项目只需要打包出一个简单的 bundle 包，并是基于 ES6 模块开发的，可以考虑使用 rollup。

其实 webpack 从 2.0 开始就已经支持 Tree-shaking，并在使用 babel-loader 的情况下还可以支持 es6 module 的打包。实际上，rollup 已经在渐渐地失去了当初的优势了。但是它并没有被抛弃，反而因其简单的 API、使用方式被许多库开发者青睐，如 React、Vue 等，都是使用 rollup 作为构建工具的。

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com