Node.js 笔记三:了解npm
2017-02-25 17:29
555 查看
转载自:http://www.jianshu.com/p/7f8d6a40e725
如果你被 Bower / spm / Component / Duo ... 坑过,请回到npm的怀抱。
---来自前端 JSer 装逼手册
npm涵盖了很多内容,不仅仅是包管理那么简单,还有
npm对应的文件是
在对应的文件夹中,输入
通常情况下,项目并不是所有的包都是global安装,因为考虑到版本兼容的问题。环境的独立性成为项目的稳定性的关键,我们会倾向于选择local包安装。这和python的virtualenv类似。
包会被分为
而dependencies承载的则是一些,可以被打包的库。
根据The semantic versioner for npm,我们可以知道为啥有
between tilde(~) and caret(^) in package.json指出了其中的不同:
~3.9.2 是指相接近的版本 例如 3.9.* 指修复bug
^3.9.2 是指相兼容的版本 例如 3.. 指向后兼容,功能升级
这是,有人就想问是不是要编辑
如果你想安装某个版本,则
如果你想从github下载最新的也可以,但是不建议因为若版本再次更新则成为一坑。
更多详情,自行查
使用的方法有很多,涵盖了单元测试,浏览器实时渲染,生成dict等等。
这里举一栗子,运用browser-sync实时刷新html和css,参考项伟平的回答-atom怎么实现html实时预览。
我们只需要在script底下,加一个
使用到watchify,uglifyjs,uglifycss等工具,详情看对应的文档。
转载,请表明出处。总目录Awesome GIS
转载,请表明出处。总目录前端经验收集器
学习前端的过程中,我整理了很多资料,也希望能共享出来帮助到更多刚接触或者接触前端不久的同学。不过也为了把控微信群的质量,入群的一定要是前端的小伙伴才可以。入群我就会把资料发给每个人,每天也会挑选前沿的前端高质量文章发到群里给大家学习。想加入的同学可以加笑笑微信:iamaixiaoxiao,拉你入群。再次强调,保证群高质量,群非前端不加,请谅解哦。扫描微信二维码也可以。
如果你被 Bower / spm / Component / Duo ... 坑过,请回到npm的怀抱。
---来自前端 JSer 装逼手册
npm涵盖了很多内容,不仅仅是包管理那么简单,还有
npm script等。
npm对应的文件是
package.json。
初始化
在对应的文件夹中,输入npm init,配置对应的参数,如
git repo,
name,
version之类。
包管理
通常情况下,项目并不是所有的包都是global安装,因为考虑到版本兼容的问题。环境的独立性成为项目的稳定性的关键,我们会倾向于选择local包安装。这和python的virtualenv类似。包会被分为
devDependencies和
dependencies,主要区别是
devDependencies针对的是开发工具,而
dependencies更多是指内容依赖关系。拿vue-leaflet的package.json为例,由于运用了ES6所以有了
babel。而
webpack也具有各样的loader。
"devDependencies": { "babel-core": "^6.0.0", "babel-loader": "^6.0.0", "babel-plugin-transform-runtime": "^6.0.0", "babel-preset-es2015": "^6.0.0", "babel-preset-stage-2": "^6.0.0", "cross-env": "^1.0.6", "css-loader": "^0.23.0", "file-loader": "^0.8.4", "json-loader": "^0.5.4", "url-loader": "^0.5.7", "vue-hot-reload-api": "^1.2.0", "vue-html-loader": "^1.0.0", "vue-loader": "^8.2.1", "vue-style-loader": "^1.0.0", "webpack": "^1.12.2", "webpack-dev-server": "^1.12.0" }
而dependencies承载的则是一些,可以被打包的库。
"dependencies": { "babel-runtime": "^5.8.0", "leaflet": "^0.7.7", "q": "^1.4.1", "vue": "^1.0.0" },
版本控制
根据The semantic versioner for npm,我们可以知道为啥有^和
~的版本控制。Difference
between tilde(~) and caret(^) in package.json指出了其中的不同:
~3.9.2 是指相接近的版本 例如 3.9.* 指修复bug
^3.9.2 是指相兼容的版本 例如 3.. 指向后兼容,功能升级
这是,有人就想问是不是要编辑
package.json文件,可以这么做。但是我们更喜欢高逼格的方法。用
--save去保存
dependencies的包,而
--save-dev保存
devDependencies的包。
npm install lodash --save
npm install browser-sync --save-dev
如果你想安装某个版本,则
npm install vue@1.0.0 npm install sax@">=0.1.0 <0.2.0"
如果你想从github下载最新的也可以,但是不建议因为若版本再次更新则成为一坑。
npm install mygithubuser/myproject
更多详情,自行查
npm help install。
npm script
使用的方法有很多,涵盖了单元测试,浏览器实时渲染,生成dict等等。这里举一栗子,运用browser-sync实时刷新html和css,参考项伟平的回答-atom怎么实现html实时预览。
我们只需要在script底下,加一个
dev指向一句CLI。在只是纯前端编码的大前提下,可以使用这句命令行来实现你要的功能,大大提高你的开发效率。
"scripts": { "dev":"browser-sync start --server --files \"**/*.html,**/*.css\"" },
简易npm script
使用到watchify,uglifyjs,uglifycss等工具,详情看对应的文档。"start": "npm run watch & serve -p 3001", "watch": "watchify -v -d example/js/app.js -o example/js/bundle.js", "build-js": "cat ./src/*.js > ./dist/app-src.js", "build-css": "cat ./src/*.css > ./dist/app-src.css", "compress-js": "uglifyjs ./dist/app-src.js -o ./dist/app.js -m", "compress-css": "uglifycss ./dist/app-src.css > ./dist/app.css", "build": "npm run build-js && npm run build-css && npm run compress-js && npm run compress-css", "release": "git push origin master && git checkout gh-pages && git merge master && git push origin gh-pages && git checkout master && npm publish"
转载,请表明出处。总目录Awesome GIS
转载,请表明出处。总目录前端经验收集器
学习前端的过程中,我整理了很多资料,也希望能共享出来帮助到更多刚接触或者接触前端不久的同学。不过也为了把控微信群的质量,入群的一定要是前端的小伙伴才可以。入群我就会把资料发给每个人,每天也会挑选前沿的前端高质量文章发到群里给大家学习。想加入的同学可以加笑笑微信:iamaixiaoxiao,拉你入群。再次强调,保证群高质量,群非前端不加,请谅解哦。扫描微信二维码也可以。
相关文章推荐
- [转载] Node.js 笔记(一) nodejs、npm、express安装
- Node.js 笔记(一) nodejs、npm、express安装
- node.js在windows下的学习笔记(3)---npm
- Node.js 笔记(一) nodejs、npm、express安装(转)
- node.js学习笔记--NPM(Node Package Manager:Node.js的第三方模块、包管理器)
- js笔记二:node.js的npm使用理解
- Node.js 笔记(一) nodejs、npm、express安装
- Node.js 笔记(一) nodejs、npm、express安装
- Node.js 笔记(一) nodejs、npm、express安装
- Node.js 笔记(一) nodejs、npm、express安装
- Node.js 笔记(一) nodejs、npm、express安装
- 概念笔记之 [Node.js<-2->]NPM使用总结
- Node.js 笔记(一) nodejs、npm、express安装
- 【Node.js学习笔记1--模块 npm】
- Node.js 笔记(一) nodejs、npm、express安装
- Node.js学习笔记--引用模块、npm
- Node.js入门学习笔记-IDE选择/配置之WebStorm(windows)
- Node.js文档学习笔记(2)
- Node.js文档学习笔记(1)
- [javascript] node.js包管理工具 npm