安装
windows上的安装十分方便,就跟安装普通软件一样,一路下一步点下去即可。
npm install -g grunt # 安装,成为全局(-g)module,保存为dev-dependencies(–save-dev) 简写 -D 一个意思
npm install -g grunt –save # 安装,保存为dependenciesnpm run dev # 打开发环境包
npm run build # 打release包
node is based on chrome v8 engine,it’s javaScript without the browser.
npm的configuration非常方便设置,首先是设置proxy
npm config set strict-ssl false
npm config set registry “http://registry.npmjs.org/“
npm config set proxy http://127.0.0.1:1080 ## 以上三句话设置代理
npm config list ##列出当前所有的设置
npm config get stuff ##比如说registry等等,其实跟git 那一套很像的
也有用淘宝cnpm的做法:
$ npm install -g cnpm –registry=https://registry.npm.taobao.org
$ npm config set registry https://registry.npm.taobao.org
$ cnpm install [name] ## 这样就能安装了
npm也支持command arguments提供registry的方式,亲测,不是一般的快,😸。
npm –registry https://registry.npm.taobao.org install -D babel-cli
whats-the-difference-between-dependencies-devdependencies-and-peerdependencies
npm有个dependencies的概念,此外还有dev-dependencies的概念,主要看package.json这个文件
{
"name": "foo",
"version": "0.0.0",
"scripts": {
"dev": "node build/dev-server.js",
"build": "node build/build.js",
"test": "",
"lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs"
},
"dependencies": {
"axios": "^0.15.3",
"jsonp": "^0.2.1"
},
"devDependencies": {
"webpack": "^2.6.1",
"webpack-dev-middleware": "^1.10.0",
"webpack-hot-middleware": "^2.18.0",
"webpack-merge": "^4.1.0"
}
}
/*script的意思是输入npm run dev = node build/dev-server.js 类似于 linux下的alias*/
/*向上箭头的意思是安装的时候会自动去查找安装最新的minor version。关于版本号,第一位表示major version,may incur code imcompatibility,第二位表示minor version,代表new features,第三位表示bug fixes.所以向上箭头意味着安装时不会动第一位,只会升级为第二位最新的版本*/
示例
app.js
console.log('hello!');
node app.js
hello!
创建node project
npm init
会提示一些信息,生成一个package.json文件
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
main是指程序的运行入口
script是指可以自己设置启动的命令,有点像alias
比如 vue-cli的package.json里面就是这样的
“dev”: “node build/dev-server.js”,
“build”: “node build/build.js”
所以用户只要输入
npm run dev
就等同于
node build/dev-server.js
const = require('http');
// http is a core module ,so we do't need install
const hostname = '127.0.0.1';
const port = 3000;
cost server = http.createServer((req,res) => {
res.statusCode = 200;
res.setHeader('Content-type','text/plain');
res.end('Hello there!');
});
server.listen(port,hostname,() =>{
console.log('Server started on port '+ port);
})
此时去浏览器中打开’localhost:3000’,会返回’Hello there!’
想要返回一个html并在浏览器中渲染,
ctrl+c停止服务器,修改代码如下。
const http = require('http');
const fs =require('fs');
const hostname = '127.0.0.1';
const port = 3000;
fs.readFile('index.html',(err,html) => {
if (err) {
throw err;
}
const server = http.createServer((req,res) => {
res.statusCode = 200;
res.setHeader('Content-type','text/html');
res.write(html);
res.end();
});
server.listen(port,hostname,() =>{
console.log('Server started on port '+ port);
})
})
现在重新运行node index,打开浏览器,在3000端口就能看到html网页了。
{
"name": "api",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"body-parser": "^1.18.2"
}
}
dependencies里面向上箭头表示安装最新的minor version。而使用”*“号的话就表示想要使用latest version
一些node自带的module
比如fs,path,http,这些东西都是不需要安装的,bundled with node installation。
path.join(__dirname,'filename'); // ./filename
path.join(__dirname,"..",filename); // ../filename ,go to parent directory
Compile ES6 ES2017 Code to ES5 Code(这部分属于webpack的内容)
npm install –save-dev webpack webpack-dev-server babel-core babel-loader babel-preset-env
npm install –save-dev babel-polyfill babel-preset-stage-0 ## 用async await的话需要安装polyfill
package.json
{
"name": "bable-assemble",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "webpack",
"start": "webpack-dev-server --output-public-path=/build/"
},
"author": "",
"license": "ISC",
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-polyfill": "^6.26.0",
"babel-preset-env": "^1.6.1",
"babel-preset-es2015": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"http-server": "^0.10.0",
"webpack": "^3.10.0",
"webpack-dev-server": "^2.9.7"
}
}
output的文件夹名有些人喜欢叫dist,有些人用build。都行,没有区别的。
如果手动敲webpack的话,会提示你找不到webpack,这是因为没有globally install webpack,webpack还只是个local file。 这也就是写在script里面的原因了: 让npm去node_modules里面找一个叫做webpack的依赖,然后运行webpack。
webpack.config.js
const path = require('path');
module.exports = {
entry:{
app:['babel-polyfill','./src/app.js']
},
output:{
path:path.resolve(__dirname,"build"),
filename:"app.bundle.js"
},
module:{
loaders:[
{
test:/\.js?$/,
exclude:/node_modules/,
loader:"babel-loader",
query:{
presets:['env']
}
}
]
}
};
yarn
yarn 是facebook设计的,yarn的速度要比npm快。在windows平台上推荐使用msi安装包安装。
npm install express
yarn add express
这俩是一样的,一些常用的command
yarn init
yarn global add nodemon
yarn outdated
yarn cache clean
yarn run dev // yarn dev 其实run都可以省略
yarn upgrade express
eslint修改配置,让js文件每一行后面都得加冒号(allow semi colons)
allow semi colons in javascript eslint
在.eslintrc中,添加custom rules
"rules": {
"semi": [2, "always"]
}
node js不支持es2015的import 和export语法,需要使用mudule的话,可使用commonJs,即:
其实这事说来就是node对于绝大多数es2015的语法都支持了,偏偏import,export这一套就不支持。
node社区最终决定使用mjs文件后缀
// library.js
module.export.awesome = function () {
consle.log('awesome');
};
// index.js
var library = require('./library');
library.awesome();
// 需要注意两点,
// 1. require()后面跟的路径是('./library'),是指在当前路径下,而不是在node_modules那个大的文件夹里面找
// 2. require('./library') 和require('./library.js')没有区别
sourcemaps
开发过程中使用的是ES2015代码,编译之后就成了非常长的es5代码,在浏览器里面几乎无法断点。使用sourcemap就能在浏览器中将es5代码“反编译”成ES2015代码,还可以打断点。
好用的module
path(core module, 无需安装)
http(core module, 无需安装)
express
nodemon // 实时监控本地文件变化,重启服务,安装npm install nodemon -g
body-parser
ejs
pm2 //starting an node app as a bcakground service
mongoose
How to debug
vscode debug node js的方式,打开调试窗口,点击那个小齿轮(打开launch.json)。直接在代码中断点即可。注意底下有一个debug console(调试控制台),可以输入变量,查看当前值,和一些大型Ide很像。
在chrome里面debug的方式:
node –inspect app.js ## 一闪而过了
node –inspect-brk app.js ##在第一行就给我停下来
在chrome的地址栏输入 about:inspect , open dedicated DevTools for Node,点一下就会出现一个小窗口
或者f12,会出现一个绿色的node的图标,点一下和上面那个open dedicated DevTools for Node是一样的
Debugging in 2017 with Node.js
process.env.NODE_ENV
if (process.env.NODE_ENV === 'production' ) {
//
}else {
//
}
// windows上可以这么设置
set NODE_ENV=dev
//直接写在js里面也行
process.env.NODE_ENV = 'production';
写在package.json的script里面也是可以的。
"scripts": {
"start": "set NODE_ENV=dev && node app.js"
}
For Mac/Linux users, you can simply type:
export MONGOLAB_URI="mongodb://username:password@ds01316.mlab.com:1316/food"
For Windows users:
SET MONGOLAB_URI=mongodb://username:password@ds01316.mlab.com:1316/food
After setting the Environment variables you need to call the Environment Variable into your code. You can do it by typing this
var url = process.env.MONGOLAB_URI;
process.env.XXX只是环境变量而已 。其实只是
a copy of the output env command on unix and set command on windows machine(注意是copy,也就是修改process.env.xxx不会影响当前shell的env)
好像crossenv比较好的处理了这个问题
=============================================================================
开发环境用nodemon,生产环境用pm2(PM2的优胜之处在于当你要将app需要多核处理的时候,PM2内部集成的负载均衡可以让你很容易的去指定运行多少个实例。)
node里面就不要用Ajax了,推荐axios,原生自带也有https。
而node中的一些module也不能用于浏览器端,比如fs这种属于偏Low level的api
typeScript教程
node js advanced topics
补上一句,国内很多软件都有比较好的源,换电脑后最好把一些常用的源都给换掉
比较出名的有清华的和中科大的源
maven有一个淘宝源, 修改~/.m2/settings.xml就行了
npm 比较出名的是淘宝的源,修改~/.npmrc就可以了,据说10分钟更新一次
homebrew也要换
docker也是
ubuntu的apt也是
openwrt的opkg也是
pip也是
不要把人生浪费在和gfw死磕上