Node.js是什么
鱼需在有水的环境下才能生存,js程序的运行同样需要环境,那就是Node.js,没有它,js程序就无法干活。所以官方对Node.js定义就是:一个基于Chrome V8引擎的JavaScript运行环境,有了它你写的js程序就可以运行了
Node.js可以做什么
nodejs官方提供了很多模块,比如fs模块可以读写系统里面的文件,http模块可以创建一个http服务器,zlib模块可以压缩文件等等,具体的功能可以看nodejs的官方文档
前端项目如何使用nodejs
- 使用官方提供的模块,nodejs环境已经提供了各种官方模块,通过require引入
var fs=require('fs')
2. 使用自己写的js文件,通过module.exports的方式把写好的功能暴露出去,在需要使用的地方通过 require('路径/js文件名')引用
//项目文件结构
nodejs
|--strApi.js
|--index.js
//strApi.js
function removeNum(str){
return str.replace(/d/gm,'') //删除字符串里面的数字
}
module.exports.removeNum=removeNum
//main.js
var strApi=require('./strApi.js') //引入removeNum
var str='123bcdefg456'
var newStr=strApi.removeNum(str) //使用removeNum,得到'bcdefg'
3. 使用别人发布的npm包
npm是什么
npm是nodejs的包管理工具,通过它,你可以很方便管理项目下面的nodejs包,例如你可以通过npm install axios
命令在你的项目下安装axios,然后你就能在项目文件下面的node_modules里面找到它,如果你想删除它,可以通过npm uninstall axios
命令 把它从node_modules里面移除
所有的npm包都可以到npmjs.com上面找到
package.json文件
每一个nodejs项目里面都会有一个package.json文件
当你创建一个新项目时,可以通过npm init
命令创建package.json文件
安装包时,通过npm install
命令把包安装到项目文件夹下面的node_modules里面
npm install
包信息不会写进package.json里面npm install --save
包信息写到package.json的dependencies里面npm install --save-dev
包的信息写到package.json的DevDependencies里面
dependencies里面的包是项目运行必须用到的包,如果缺少了,项目无法正常运行,devDependencies里面的包是在项目开发时会使用到的包,不是项目运行所必须的,比如所你想安装一个监视文件变化的包,这个包并不是项目所必须要,只是为了方便开发而安装的
把包写进package.json里面有什么作用?
当你使用git时,可以在项目创建一个.gitignore
文件,把node_modules的路径写进里面,当你提交文件时,node_modules里面的文件就不会提交的本地仓库,把本地仓库push到远程仓库时,node_modules文件夹就不会推送到远程仓库上,当你从另外一个电脑上把仓库克隆下来后,虽然项目里面没有node_modules文件,但是package.json里面记录了项目所以来的npm包,可以通过npm install
命令把项目所有依赖的包下载下来,而不需要你一个一个的去安装。
nrm
有时候使用npm安装包时会很慢,这时可以安装nrm切换npm源 ,方法:
- 全局安装nrm
npm install nrm
- 查看npm源
nrm ls
- 使用npm源
nrm use taobao
package.json里面的script
在package.json文件里面有一个script属性,可以使用自定义的名称的方式来执行一个命令,类似Linux里面的alias,命令里面使用的nodejs模块默认是项目文件下面node_modules里面的模块,使用方法是:npm run 自定义的名称
例如你想把你写好style.less文件自动编译成style.css文件,先安装onchange和less模块,然后在script里面设置:
"scripts": {
"autoLess": "onchange style.less -- lessc style.less style.css"
},
最后在终端输入npm run auotLess
,当你修改你的less文件保存后,程序会自动把less文件编译成css文件