小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)

背景介绍:最近开始看了小程序的一些资料,感觉小程序在做的事更多像是把App由CS模式回归于BS模式,这很想当年没有App的时候很多公司没有钱做App,直接做个App直接封装网页。这个该怎么评价呢?个人觉得技术上让很多人没了开发的热情,而是都去搞网页界面设计去了,没有了程序百家争鸣的感觉。但是换个角度,他们做的事更像是保护小企业让他们花更小的成本去创业,把重点放在创意上,而且安全工作基本全都交给了某迅,省了很多事。至于这盘棋怎么下,就看他们自己了。


配置环境(window + Nodejs + 微信web开发者工具)

1、首先配置Nodejs。到官网https://nodejs.org/en/download/下载对应版本的Nodejs。

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第1张图片

2、安装Nodejs(默认安装完即可)

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第2张图片

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第3张图片

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第4张图片

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第5张图片

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第6张图片

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第7张图片

3、安装完成后,使用win+r打开CMD命令测试一下【node -v】和【npm -v】查看版本

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第8张图片

4、配置安装包的默认环境(如果不配置,npm install时会安装在C:\Users\用户名\AppData\Roaming\npm目录下),找到安装目录创建两个文件夹【node_global】及【node_cache】。

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第9张图片

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第10张图片

5、执行set命令配置环境

npm config set prefix "C:\Program Files\nodejs\node_global"
npm config set cache "C:\Program Files\nodejs\node_cache"

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第11张图片

6、设置环境变量,关闭cmd窗口,“我的电脑”-右键-“属性”-“高级系统设置”-“高级”-“环境变量”,在【系统变量】下新建【NODE_PATH】,输入【C:\Program Files\nodejs\node_global\node_modules

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第12张图片

7、将【用户变量】下的【Path】修改为【C:\Program Files\nodejs\node_global】

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第13张图片

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第14张图片

8、配置完后,安装个module测试下,我们就安装最常用的express模块,打开cmd窗口,
输入如下命令进行模块的全局安装

npm install express -g     # -g是全局安装的意思

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第15张图片

出现上面的错误是因为安装在C盘没有系统权限,使用管理员权限打开cmd即可。

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第16张图片

至此Nodejs安装完毕


9、去官网https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html?t=2018712下载微信web开发者工具。

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第17张图片

10、安装微信web开发者工具并扫描登陆

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第18张图片

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第19张图片

小程序学习笔记(一):配置环境(window + Nodejs + 微信web开发者工具)_第20张图片

至此配置完成。即将开始开发之旅。

你可能感兴趣的:(小程序)