***********Windows系统安装NodeJS,在IDEA开发工具下集成NodeJS插件**************
Node.js下载地址:
https://nodejs.org/en/download/
开发环境部署:
windows安装NodeJS,双击安装包安装。
与普通软件安装一样,下一步–接受—下一步—修改安装目录—下一步…
测试NodeJS安装是否成功:
查看path环境变量里有没有配上NodeJS的安装目录。
如果没有的话,配置一下,在path里加;D:\Program Files\nodejs\;(路径到nodejs文件夹)
cmd命令行:node -v查看版本号,如果有版本号出来就安装成功
测试NodeJS:
在cmd终端输入node进入命令交互模式,输入console.log(“hello world!”);回车,有输出则创建成功
IDEA的NodeJS插件下载:
http://plugins.jetbrains.com/plugin/6098?pr=idea
IDEA集成NodeJS
当前IDEA的版本为
File–>settings—>Editor–>Plugins—>右下角第三个(Intall plugin from disk:从磁盘中找)
—>找到NodeJS-162.1628.7.zip文件,选中之后点击apply–>ok
点击 Restart(重启)
查看IDEA有没有集成成功:
在IDEA的file菜单—new—project—Node.js and NPM(在Static Web的下面),如果有,则集成成功。
可以创建NodeJS项目
NPM基本使用指令:
npm help config【安装了npm的前提下执行此命令可直接跳转到nodejs官网帮助文档,学习npm指令】
(file:///E:/Myoffice/nodejs/node_modules/npm/html/doc/cli/npm-config.html)
- npm install -g ××× ×××【加g全局安装依赖 可以多个】 例如:npm install -g ionic@latest
- npm clear cache 【清除npm缓存】
- npm install gulp-less(node插件名称)-g –save-dev 【后面的–save的意思是保存到配置文件】
- npm update -g cordova ionic (更新)
- npm install -g cordova ionic (安装)
- npm install -g ionic@latest 【下载最新版本ionic依赖库】
- -g:全局安装
- –save:将保存配置信息至package.json(package.json是nodejs项目配置文件);
- -dev:保存至package.json的devDependencies节点,不指定-dev将保存至dependencies节点;
- npm config set registry “http://registry.npm.taobao.org” (没FQ的情况下一定要设置这个)【npm install的node_modules才不会报错】
- npm config set registry “http://registry.npmjs.org” 【默认设置】
npm install 安装出错问题解决如下
rm -rf node_modules
npm clean cache
npm updatenpm install -g cordova to update 或者npm update -g cordova (更新至最新版本的cordova 库) 或者 npm install -g npm/cordova/ionic【默认下载最新的】
- npm install -g ionic cordova@5.0.0 或者 npm install -g ionic@1.6.5 【安装特定版本:】
- npm uninstall -g cordova ; npm uninstall -g ionic; 【删除插件】
npm其他命令使用
- npm run XXX是执行配置在package.json中的脚本,比如:
- -
“scripts”: {
“dev”: “node build/dev-server.js”,
“build”: “node build/build.js”,
“unit”: “karma start test/unit/karma.conf.js –single-run”,
“e2e”: “node test/e2e/runner.js”,
“test”: “npm run unit && npm run e2e”,
“lint”: “eslint –ext .js,.vue src test/unit/specs test/e2e/specs”
},
只有这里配置了,你才能run,所以不是所有的项目都能npm run dev/build。要了解这些命令做了什么,就要去scripts中看具体执行的是什么代码。这里就像是一些命令的快捷方式,免去每次都要输入很长的的命令(比如unit那行)。
为什么会出现ERROR,就是因为在跑这些对应的脚本文件的时候,可能是某些依赖没有被加载等的。
一般项目都会有build, dev, unit等,从名字上基本能看出来是干什么的。比如上面配置的unit,就是开启karma去跑单元测试,具体测试内容,要去看karma.conf.js;e2e就是end to end的端到端测试;而test则会将单元测试和端到端测试都执行。
有些项目中根据需要,还会配置其他命令,例如自动生成文档,比如这里:
"build:doc": "node ./scripts/build-doc.js",
如果你去build-doc.js中看的话,会发现,这个脚本在遍历所有源文件,解析注释和其他内容,自动生成
————-webstorm激活:http://idea.iteblog.com/key.php
————-webStorm 常用快捷键:
- ctrl + shift + n: 打开工程中的文件,目的是打开当前工程下任意目录的文件。
- ctrl + j: 输出模板
- ctrl + b: 跳到变量申明处
- ctrl + alt + T: 围绕包裹代码(包括zencoding的Wrap with Abbreviation)
- ctrl + []: 匹配 {}[]
- ctrl + F12: 可以显示当前文件的结构
- ctrl + x: 剪切(删除)行,不选中,直接剪切整个行,如果选中部分内容则剪切选中的内容
- alt + left/right:标签切换
- ctrl + r: 替换
- ctrl + shift + up: 行移动
- shift + alt + up: 块移动(if(){},while(){}语句块的移动)
- ctrl + d: 行复制
- ctrl + shift + ]/[: 选中块代码
- ctrl + / : 单行注释
- ctrl + shift + / : 块注释
- ctrl + shift + i : 显示当前CSS选择器或者JS函数的详细信息
- ctrl + ‘-/+’: 可以折叠项目中的任何代码块,它不是选中折叠,而是自动识别折叠。 【使用前先全选,在使用】
- ctrl + ‘.’: 折叠选中的代码的代码。
- shift + esc: 当前激活的任意小窗口最小化,也可以是alt+数字键,数字在小窗口有显示。
- alt + ‘7’: 显示当前的函数结构。
- 如果是*.html页面,则在文件名下的导航栏某DOM结构上右键,可以全选当前DOM结构。