前端环境配置与搭建

一、工具下载安装

1.编辑器WebStorm

2.Git(分布式的代码管理工具)

3.Photoshop

4.Nodejs

链接:https://nodejs.org/

二、 环境配置

1.安装git 与 webStorm

2.配置git:

设置Git的user name和email:

打开git.exe,输入命令:

$ git config --global user.name "name"

$ git config --global user.email "[email protected]"

生成SSH密钥过程:

查看是否已经有了ssh密钥:cd ~/.ssh

如果没有密钥则不会有此文件夹,有则备份删除

生成密钥:

$ ssh-keygen -t rsa -C "[email protected]"

按3个回车,密码为空。

Your identification has been saved in /home/tekkub/.ssh/id_rsa.

Your public key has been saved in /home/tekkub/.ssh/id_rsa.pub.

The key fingerprint is:

………………

最后得到了两个文件:id_rsa和id_rsa.pub

添加密钥到ssh:

登陆gitlab, Profile Settings -> SSH Keys -> ADD SSH KEYS ,找到本地的id_rsa.pub文件,复制出里面的内容,添加到 key 内,此时 Title 会自动填上你的邮箱,没有的话手动填写, ADD KEY

3.webStorm 连接git

打开webStorm: File -> Setting -> Version Control ->Git : D:\Git\bin\git.exe

4.拉取代码到本地

创建一个存放项目的文件夹,在该文件夹下,单击右键,选择git bash,打开git命令框,编写命令:git clone [email protected]:xx/xx.git(可以在gitlab项目中找到存放地址,gitlab地址:http://gitlab.vchangyi.com ),按回车,就可以从gitlab上clone代码到本地文件夹

5.手动安装nodejs,如果是pc端安装的话,nodejs版本不能过低。

ps:亲自踩过的坑,由于我们手机端的项目是比较早的了,所以如果跑手机端的话,nodjs不可安装最新版,安装最新版的话npm安装项目依赖会有问题,手机端gulp无法启动,所以建议安装nodejs V6。

6.测试node是否安装成功

在git 命令窗或者node 命令窗中输入命令 : node -v

7.同理,测试npm是否安装成功 npm -v

8.安装gulp

在项目下打开git 命令窗,从淘宝源上自行安装,这个时间需要等待和耐心,也会有网络原因导致安装失败,如果安装失败可以多来几次,直到成功为止。

如果是移动端: npm install -g gulp --registry=http://registry.npm.taobao.org --phantomjs_cdnurl=http://cnpmjs.org/downloads

npm install --registry=http://registry.npm.taobao.org --phantomjs_cdnurl=http://cnpmjs.org/downloads

如果是pc端:npm install --registry=http://registry.npm.taobao.org --phantomjs_cdnurl=http://cnpmjs.org/downloads

npm 安装时候 持久使用淘宝源 设置:

npm config set registry https://registry.npm.taobao.org

// 配置后可通过下面方式来验证是否成功

npm config get registry

// 或

npm info express

9.移动端启动gulp

打开webStorm,点击底部的 Terminal 打开输入窗,输入命令 : gulp serve

ps:如果手机端gulp无法启动,请检查nodejs版本,参考本wiki的第五条nodejs的安装。

同理,pc端启动:npm run serve

原文地址:https://www.cnblogs.com/nini-huai/p/11010407.html

时间: 2024-10-23 06:59:49

前端环境配置与搭建的相关文章

年终福利,PHP7+Apache2.4+MySQL5.6 源码编译安装,环境配置,搭建你自己的LAMP环境

PHP7 都出来了,你还在玩PHP5吗? MySQL5.6 早都出来了,你还在玩MySql5.2吗? Apache2.4 早都出来了,你还在玩Apache2.2吗? 笔者不才,愿意亲自搭建环境,供搭建参考.这里是源码安装的奥,什么一键安装包,什么yum安装,什么rpm安装都统统略过(笔者是一个自虐狂,就像windows下安装软件一样,不喜欢安装在默认的位置也就是C盘了,否则系统盘就爆了) 安装之前了,要说明下,要保证PHP在最后安装,原因后面揭晓.安装任何一个软件之前,都要确保它所依赖的库都安装

Linux下编译环境配置和搭建

配置安装虚拟机和Ubuntu系统: 虚拟机安装: VMware Workstation版本:vmware-workstation-full-9.0.2-1031769 安装前请大家切记BIOS的VT功能,不开的话安装Ubuntu 64bit 是不允许的.(设置安装64bit系统注意事项) 开启方式:Bios -> Security -> System Security -> enable VT 开启后就可以安装VM并自行破解. 注意:要先开启VT开安装VM,先安装VM再开启VT的话是不行

环境配置——IDEA搭建maven+spring mvc开发环境

1. 新建工程,选择maven项目,选择如下图选项,next 2. 填写groupId和artifactId,这是maven为了确定项目在maven仓库中的唯一性而设置的.groupId一般写域名.公司名,artifactId则是项目名. 3.选择maven配置文件地址,可以选择自己下载的maven,然后自定义配置文件中的仓库地址,就不用所有东西都堆在C盘了.以及将远程仓库地址改为阿里云仓库,这样下载速度会快一些. 4.然后一路next,就可以完成maven工程的构建了.接下来配置spring

前端开发神器WebStorm--Grunt 搭建环境(03)

通过上一篇前端开发神器WebStorm--自动化工作流(前言),相信大家都Grunt自动化工具有了初步了解. 接下来我就以WROC3000 web为原型,演示一下如何使用Grunt工具提高工作效率,最大程度压缩代码. 1.首先安装node环境 进入官网 下载安装.(记住安装目录) 检测安装成功方法:打开CMD窗口,输入 node --version 会打印出安装的版本号,说明已经安装成功. 2.安装 Grunt 客户端 在CMD 窗口中,切换到node安装盘符,会自动切换到nodejs安装目录.

SpringBoot31 重识Spring01-环境搭建、Actuator监控、属性配置、多环境配置

1 前言 1.1 学习阶段说明 从2016年9月开始接触IT,学习经历主要分为以下三个阶段 1.1.1 入门阶段 从最基础的前端技术HTML.JavaScript.CSS开始入门,再到后端技术Java基础.MySQL数据库基础知识.JDBC.Servclet.JSP.利用这些简单技术实现了从前端.后台.到数据库单表的CRUD操作. 1.1.2 进阶阶段 刚入行时常常听别人说起XXX框架好NB,可以干XXX.我接触了第一个框架Spring,紧接着MyBatis:再到前端框架Angular2.Vue

Hadoop伪分布环境搭建——Linux环境配置

hadoop最近可以说是相当火,也勾起了我的兴趣,所以打算学习一下.想要学习hadoop肯定要先学会在自己的电脑上搭建一个hadoop伪分布环境.伪分布模式安装步骤的第一步就是要配置Linux环境.我自己的Linux是Ubuntu系统,不过只要是Linux系统,都大同小异,配置步骤基本没啥区别. 首先,需要进行本地网络配置.我们需要在linux系统下新增一个网络连接,自己设定好ip(ipv4)地址,子网掩码和网官.下图是我的设置: 接下来,还需要在window本地连接上也设置windows下的i

Octopress 搭建静态博客网站环境配置

备忘录:记录一下搭建过程 1.安装Git 鼠标右键--打开Git Bash 打开命令行配置git(要有github账号:name) $ git config --global user.name "name" 配置git的全局用户信息(可以看到是哪个用户,哪个邮箱提交的) $ git config --global user.email "[email protected]" 生成秘钥: $ ssh-keygen -t rsa -C "[email pro

史上最详细Windows版本搭建安装React Native环境配置 转载,比官网的靠谱亲测可用

史上最详细Windows版本搭建安装React Native环境配置 2016/01/29 |  React Native技术文章 |  Sky丶清|  95条评论 |  33530 views 编辑推荐:稀土掘金 是一个高质量的技术社区,从 React Native 到 RxJava,性能优化到优秀开源库,让你不错过移动开发的每一个技术干货.各大应用市场搜索「掘金」,技术干货尽在掌握中. 说在前面的话: 感谢同事金晓冰倾情奉献本环境搭建教程 之前我们已经讲解了React Native的OS X

一、记一次失败的 CAS 搭建 之 环境配置

========================================================================================================= Setp1:安装JDK.Tomcat.以及相关关联::参考:http://jingyan.baidu.com/article/8065f87fcc0f182330249841.html ===================================================