Windows下搭建NodeJS绿色版开发环境

本文介绍了如何在Windows 8系统下无需管理员权限搭建NodeJS绿色版开发环境,包括从官方下载Node.js,从GitHub获取并安装NPM,设置淘宝镜像以及配置环境变量,使得cmd中可以直接运行Node.js和NPM命令。

文章最初发布于 szhshp的第三边境研究所 , 转载请注明

开发背景

博客一直用的是Jekyll, 突然想玩玩NodeJS和Hexo, 于是就试着搭建一下

绿色环境, 基于Window8, 不需要管理员权限

 NodeJS安装

主要就是本体和NPM

当前版本:

node -v
v6.9.4

npm -v
4.1.1

NodeJS Installation

官网直接下载最新Node.exe就是

NPM Installation

  1. Download the latest npm release from GitHub ( https://github.com/npm/npm/releases )
  2. Create folders c:\nodejs\node_modules and c:\nodejs\node_modules\npm
  3. Unzip the downloaded zip file in c:\nodejs\node_modules\npm folder
  4. Copy npm and npm.cmd files from c:\nodejs\node_modules\npm\bin to c:\nodejs folder

Once s

<think>我们正在回答用户关于使用IntelliJIDEA搭建AngularJS开发环境并编译项目的问题。根据引用内容,我们可以整理出以下步骤:1.**环境准备**:确保已安装Node.js和npm(AngularJS开发所需的基础环境)[^1]。2.**安装AngularCLI**:通过npm全局安装Angular命令行工具,用于创建和管理Angular项目[^1]。3.**创建新项目**:-在IntelliJIDEA中,选择`File`->`New`->`Project`。-在弹出的窗口中,选择`JavaScript`,然后选择`AngularCLI`[^1]。4.**配置项目**:-指定项目名称和位置。-选择AngularCLI的版本(如果已全局安装,IDEA通常会检测到)。-点击`Create`,IDEA会自动创建项目并安装依赖。5.**运行项目**:-创建完成后,IDEA会自动生成运行配置。如果没有,可以手动创建一个:-点击右上角的运行配置下拉菜单,选择`EditConfigurations`。-点击`+`,选择`npm`。-在`Command`中选择`run`,在`Scripts`中选择`start`(对应`package.json`中的`start`脚本)。-运行该配置,IDEA会启动开发服务器,通常访问`http://localhost:4200`即可查看应用。6.**编译项目**:-为了生成生产环境的代码,可以使用AngularCLI的构建命令。-在IDEA中,可以创建一个新的npm运行配置:-`Command`选择`run`,`Scripts`选择`build`(对应`package.json`中的`build`脚本)。-运行该配置后,编译结果将输出到`dist/`目录下。注意:引用[2][3][4]虽然提到了一些关于Maven、SpringBoot等的内容,但与我们当前的问题(AngularJS)无关,因此不予采用。根据以上步骤,我们可以给出详细的指导。</think>### 使用 IntelliJ IDEA 配置 AngularJS 开发环境并编译项目 #### 一、环境准备 1. **安装 Node.js 和 npm** - 访问 [Node.js 官网](https://nodejs.org/) 下载安装包 - 安装后验证: ```bash node -v # 查看 Node.js 版本 npm -v # 查看 npm 版本 ``` 2. **安装 Angular CLI** ```bash npm install -g @angular/cli # 全局安装 Angular 命令行工具 [^1] ``` #### 二、IDEA 配置步骤 1. **新建 Angular 项目** - `File` → `New` → `Project` - 选择 `JavaScript` → `Angular CLI` [^1] - 设置项目名称和路径 - 点击 `Create`,IDEA 会自动初始化项目结构 2. **配置开发环境** - **依赖安装**:IDEA 会自动执行 `npm install`(如未触发,手动在终端运行) - **运行配置**: - 点击顶部工具栏 `Add Configuration` → `+` → `npm` - 设置 `Script` 为 `start`(对应 `package.json` 中的启动脚本) - 保存后点击绿色箭头运行,默认访问 `http://localhost:4200` 3. **关键目录说明** ``` src/ ├── app/ # 组件和模块 ├── assets/ # 静态资源 ├── index.html # 入口文件 └── main.ts # 应用启动入口 [^3] ``` #### 三、编译与打包 1. **开发环境热更新** - 修改代码后 IDEA 自动重新编译(通过 `ng serve` 实现) 2. **生产环境编译** - 终端执行: ```bash ng build --prod # 生成优化后的代码到 dist/ 目录 [^3] ``` - 或通过 IDEA 的 npm 配置: - 新建 `npm` 运行配置 → 设置 `Script` 为 `build` - 添加参数 `--prod` 3. **部署输出** - 编译后的文件位于 `dist/[project-name]` - 可直接部署到 Web 服务器(如 Nginx、Apache) #### 四、常见问题解决 1. **依赖安装失败** - 尝试切换 npm 镜像源: ```bash npm config set registry https://registry.npmmirror.com ``` 2. **端口冲突** - 修改启动端口: ```bash ng serve --port 4500 ``` 3. **IDEA 识别问题** - 右键点击 `node_modules` → `Mark Directory as` → `Not Excluded` - 重启 IDEA 索引:`File` → `Invalidate Caches` > **提示**:AngularJS(Angular 1.x)与 Angular(2+)不同。若需开发 AngularJS 项目: > 1. 创建空项目后手动添加 `angular.js` 依赖 > 2. 在 `index.html` 中引入: > ```html > <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script> > ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值