前端知识理论整理

yang10086 / 2023-08-21 / 原文

webpackjavaScript应用的静态模块化打包工具()

package.json:通过npm init生成的,npm包管理的文件。

eslint用于识别和报告在 ECMAScript/JavaScript 代码中发现的模式的工具,其目标是使代码更加一致并避免错误。

模块化

前端模块化的一些方案:AMD、CMD、CommonJS、ES6(浏览器不能识别它们,但是webpack可以做它们的底层支撑,方可进行模块化开发)

  • ES6之前,要想进行模块化开发,就必须借助于其他的工具,让我们可以进行模块化开发
  • 并且在通过模块化开发完成了项目后,还需要处理模块化间的各种依赖,并且将其进行整合打包
  • 此时出现webpack,其中一个核心就是让我们可能进行模块化开发,并且会帮助我们处理模块间的依赖关系。
  • 而不仅仅是JavaScript文件,我们的CSS、图片、json文件等等在webpack中都可以被当做模块来使用。

eslint

1.新建一个文件夹进入目录内执行npm init -y创建一个新项目.

2.执行npm i eslint -D安装ESLint依赖.

3.在项目根目录下创建.eslintignore文件,设置需要被ESLint忽略的文件,文件中填入下面代码.以下标注目录下的文件,ESLint不会对其做语法检查.

4.在项目根目录下创建.eslintrc.js文件,此文件就是ESLint的核心配置文件,所有的代码约束规则都可以在该文件中编写.

5.运行代码 npm run eslint