打造前端 Deepin Linux 工作环境——配置静态服务器

打造前端 Deepin Linux 工作环境——配置静态服务器

我们前面虽然已经安装了一个 xampp 的集成服务器环境,但是这个东西实在是太重了。一般情况下,我们写个css或者 js 居然要跑那个东西我实在是优点受不了。所以呢,我这一篇博文呢,就来讲一下,我们如何搞几个静态的服务器。

Python 静态服务器

其实 python 的服务器功能还是蛮强大的,但是对于我们前端工程师来说,还是把它当成一个简单的静态 http 服务器就好。

好,首先我们打开终端工具,在里面输入

python

看能否启动 python 环境,如下图所示:

好,我们可以看到 跑的版本是是 python 2.7.13 也就是 python 2 了。

python 2 的启动 httpserver 的命令是:

python -m SimpleHTTPServer

我们到前面配置 xampp 的时候随便写的一个 html 文件目录中执行这个命令,如下图所示:

然后我们在浏览器里面输入: http://127.0.0.1:8000/,就可以看到如下图所示的结果了。

这个命令还是有点太长了。我们把这个命令缩短一点,还是用前面的章节中说的方法,在命令行中执行下面的命令:

echo 'alias pyhttp="python -m SimpleHTTPServer"' >> ~/.bash_profile && . ~/.bash_profile

执行完成之后,我们就可以用 pyhttp 这个我们自定义的一个缩写的命令来启动 pyhttp 静态 http 服务了。

如果想要换个端口来启动服务,则命令就是

pyhttp 4000

这样就可以了。

如果你安装的是 phthon 3 那么命令就不是 python -m SimpleHTTPServer 而是要改成 python -m http.server 效果是一样的。

全局安装 nodejs 的 http-server 服务

有上面的那一个方法就可以哈,这里是作为一个补充。nodejs 有一个 http-serverhttp服务包,全局安装之后,也可以启动一个 http 服务。

安装命令如下:

sudo npm install http-server -g

安装完成之后,我们就可以使用 http-server 命令来启动一个 http 服务了。

// 启动一个http服务 默认端口 8080
http-server
// 指定一个端口启动
http-server -p 9000

运行结果如下图所示:

这个命令不算太长,但是你和我一样还是喜欢短的,不需要进行缩短,因为它已经给了一个默认的缩短的了。

// 启动一个http服务 默认端口 8080
hs
// 指定一个端口启动
hs -p 9000

这我就不放图了。

安装 Browsersync 服务

前面的两个静态服务器都是不会自己刷新的,我们为了提高效率,会搞一个自动刷新的 http 服务,然后我们边写代码,浏览器里就自动刷新,这样就可以大大提高我们的效率了。这个我以前的博文中也有推荐过,大家可以看详情:http://blog.csdn.net/fungleo/article/details/60476466

那边是说的 mac 系统,其实和 linux 是一样一样的。所以详情去我那篇博文看,我这里只说安装命令和命令缩短命令。

安装 Browsersync

sudo npm install -g browser-sync

具体怎么使用,看我上面的连接,我把最常用的,缩短成bshttp

// 编辑配置文件
vim ~/.bash_profile
// 给文件末尾添加
alias bshttp='browser-sync start --server --files "**/*.css, **/*.html"'
//:wq 保存退出
// 使配置文件生效
. ~/.bash_profile

小结

python 一般系统都自带,所以直接用它的没什么不好的。http-servernodejs 的一个服务包,喜欢就安装,不喜欢也无所谓。最后一个是 Browsersync 强烈推荐安装。具体怎么使用,请查看 效率工具 Browsersync ,文件保存浏览器自动刷新

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏IT探索

ld-linux.so.2

/lib/ld-linux.so.2以及它的64位版本/lib64/ld-linux-x86-64.so.2虽然看起来是共享库文件,但实际上他们可以独立运行。他...

841
来自专栏Seebug漏洞平台

Wordpress <= 4.6.1 使用语言文件任意代码执行 漏洞分析

Author: p0wd3r (知道创宇404安全实验室) 0x00 漏洞概述 1.漏洞简介 WordPress是一个以PHP和MySQL为平台的自由开源的博...

3204
来自专栏闵开慧

eclipse中执行程序显示找不到主类

eclipse中执行程序显示找不到主类 这种情况一般出现在工程中已编译有class文件的java文件,而后面新建的java则不会出现问题。这种情况说明工程bin...

3455
来自专栏性能与架构

mysql执行过程

启动 初始化模块读取系统参数和命令行参数,初始化整个系统,例如分配buffer、初始化全局变量,同时,启动各存储引擎 启动完成后,交给连接管理模块接手,连接管理...

3636
来自专栏前端小叙

内网映射到外网方法收集

一、nat123 二、ngrok 官网服务器被墙了 不能使用,显示reconnecting,可以使用自己搭建的服务器来试  三、花生壳 四、frp  htt...

44110
来自专栏静下来

discuz论坛修改注册页面增加提示的教程方法

其实discuz关于在注册页面增加相关提示,在后台也能设置一点点。 但是太局限性了,可能就不太适合有的站长。 那我们就可以通过修改注册页面的文件代码来实现了。 ...

3957
来自专栏蓝天

mysql-5.7.10普通安装

这里安装的是最新的MySQL 5.7.10,下载网址为:http://dev.mysql.com/downloads/mysql/,本文选择是的“Linux ...

972
来自专栏ytkah

laravel项目出现Non-static method Redis::hGet() cannot be called statically的解决方法

  早上ytkah在配置laravel项目中出现Non-static method Redis::hGet() cannot be called statica...

1404
来自专栏编程语言

Python:VScode 设置Python不同版本运行环境

1.首先本地安装有不同的Python的版本,比如2.7和3.5.mac下一般默认自带2.7版本。  终端输入侧  python -V 则显示默认版本号。而p...

1302
来自专栏企鹅号快讯

最实用的Linux命令总结

1.linux安装中文环境(可选) 联网之后执行:sudo yum groupinstall chinese-support,安装完语言包之后修改/etc/sy...

2888

扫码关注云+社区

领取腾讯云代金券