外部模块
外部模块:任何人都可以写一个js文件,然后使用exprots曝光,这就是一个外部模块
npm–>工具
npm 全称 :Node Package Manager
定义:它是管理外部模块的工具,npm是也是一个网站,可以搜索全部的外部模块
作用
安装模块
卸载模块
更新模块
npm 命令
本地安装
npm install 模块名称 ,安装完毕以后就可以通过require 引用模块 然后使用
npm uninstall 卸载模块
npm ls 查看当前安装的模块
npm root 查看模块 安装的位置
以上安装都属于本地安装 只能在当前文件下运行
全局
npm install 模块名称 -g 全局安装模块
npm uninstall -g全局卸载模块
npm ls -g查看全局安装的模块
npm root -g 查看全局模块 安装的位置
package.json
定义:管理外部模块的文件,只要用外部模块,就要有package.json这个文件
创建package.json npm init --yes
如何把安装的外部模块放到package.json中的dependencies里
npm install 模块名称 --save
npm install 模块名称 --save-dev 把安装的外部模块放到package.json中的devDependencies中
package.json
参数
name:当前项目的名字
version:当前项目的版本
description:当前项目的描述
main: 当前项目的入口文件
dependencies: 依赖的外部模块
devDependencies:依赖的外部模块
keywords:关键字:搜索关键字
author: 作者
license: 许可证
gulp()压缩
安装gulp 就像跑火车
第一步:要想使用gulp,必须通过npm install 安装gulp -------> 把火车造出来了
第二步: 我们要通过npm install -g gulp-cli 才能运行gulp 【一劳永逸,安装完毕以后就不用管了】----> 铁路和电,能让火车跑起来
第三部: 一定要创建:gulpfile.js 才能执行gulp任务 -----> 动车组人员
自动化构建工具:
gulp
webpack
grunt
git 版本管理工具
由于gulp是工具!!!!!!!
因此:在安装gulp时 npm install gulp –save-dev 把gulp放到devDependencies中
gulp能够实现哪些功能
文件的删除
文件和合并
监控文件变化
文件的压缩
压缩文件
压缩html文件步骤
1. 要想压缩html,第一个需要npm install gulp-htmlmin
2. 在gulpfile.js中 使用require引入gulp-htmlmin
3. 就可以压缩文件
源码
gulp.task('default',function () {
gulp.src('./*.html')
.pipe(htmlmin({
collapseWhitespace:true,
removeCommentsL:true
}))
.pipe(gulp.dest('dest'))
})
压缩js文件步骤
1. 要想压缩js文件,给需要npm install gulp-uglify
2. 在gulpfile.js中,使用require引入gulp-uglify
3. 就可以通过pipe压缩文件了
源码
gulp.task('aaa',function(){
gulp.src('./a.js').pipe(jsmin()).pipe(gulp.dest('./js'))
})
压缩css文件步骤
1. 要想压缩css文件,需要npm install gulp-minify-css
2. 在gulpfile.js中,使用require 引入gulp-minify-css
3. 就可以使用pipe进行压缩了
源码
gulp.task('mincss',function(){
gulp.src("./b.css").pipe(cssmin()).pipe(gulp.dest('./css'))
})
方法
task():两个参数 1. 任务名称 【任意字符串】 2. 是回掉函数 -> 在黑窗口中输入gulp
watch 方法: 监听文件的改变
gulp.watch():1. 监听文件的路径,第二个参数数组,表示要执行的任务
express
创建express项目步骤:
1. 创建package.json文件 — npm init –yes
2. 安装express外部模块 npm install express –save
3. 创建js文件就可以使用express模块了
方法
方法
POST
GET
方法
ejs显示页面
使用ejs模板显示页面 — 可以让我们直接显示页面,。。还可以改变页面中的内容
使用ejs模板步骤:
1. npm install ejs –save 安装模板
2. require(‘ejs’)引入模板
3. 通过app.set(‘view engine’,’ejs’)设置模板
4. 直接重命名html文件变成ejs
5.必须创建views文件夹,把ejs放到views中
6.直接通过res.render 显示页面
改变页面内容
我们可以通过 <%= aaa %> 改变页面内容,
如果要写了%模板,在res.render()页面时,必须有第二个参数,第二个参数是一个对象,必须要有aaa字段
显示图片
我们可以创建一个文件夹,然后把所有的图片,js文件,css文件等静态内容放到此文件夹中
只要是前端浏览器中用到的 js css 图片 都可以到这个文件夹里找
app.use(expresss.static(‘public’))
MongoDB
与mysql区分
mongodb是非关系型数据库,mysql是关系型数据库
在mongodb中所有的数据,都用json表示
运行MongoDB
1. 安装mongodb, 【完毕】
进入C:\Program Files\MongoDB\Server\3.6\bin 把mongo和mongod发送到桌面
在C盘下【mongodb安装的盘】 创建 data文件夹, 进入data 创建db文件夹
双击mongod.exe !!!! 运行mongodb
双击mongo.exe 操作mongodb 【要操作mongodb,必须先运行 mongod 在运行mongo 顺序不能错】
MongoDB数据库操作
show dbs: 展示当前所有数据库
use 数据库名称: 创建数据库 / 切换数据库
dropdatabase: 删除数据库 — 想要删除数据库 必须进入数据库
MongoDB对集合(表)的操作
db.createCollection(‘集合名称‘)创建集合
show collections 展示集合
db.集合名称.drop() 删除集合
增删改查
1.增加文档:db.集合名称.insert({a:1}) ::::insert里面一定要是json形式
2.删除文档: db.集合名称.remove() ::::: remove 一定要是json表示要删除的文档
3.改变文档:db.集合名称.update({原有json},{改变的json})
4.查询文档:db.集合名称.find()
模糊查询
db.集合名称.find({name:/aa/}) mongodb模糊查找就是正则表达式查找
express 框架
安装运行 (天龙十步部)步骤
1. 直接通过express -e 项目名称【英文】 创建一个项目【文件夹】
进入【创建的文件夹】 cd 文件夹的名字
npm install 直接安装package.json中dependencies中的依赖模块
直接删除views中index.ejs中的内容,写上自己的页面内容
在routes中的index.js文件中,对相应的请求做出相应【路由】
6. 安装mongodb 的驱动 【让nodejs 能操作mongodb】 npm install mongodb@2.2.0 –save在index.js文件中,引入mongodb,连接数据库
一定要通过mongo.MongoClient 创建mongo对象,才能连接数据库
一定,一定,一定要启动数据库
10.使用npm start 启动项目