Mac运行静态站点

背景说明

开发过程中时常会需要搭建静态站点,可以利用os中已经安装的python工具开启简单的http服务

SimpleHTTPServer是Python 2自带的一个模块,是Python的Web服务器。在Python 3已经合并到http.server模块中。

解决方案

打开命令行终端,可以通过启动坞进行启动,查看python版本使用如下命令:

python -V

打开终端进入需要发布的目录,输入对应Python版本的目录即可。

Python2

python -m SimpleHTTPServer 

Python3

python -m http.server

方案验证

如果不指定端口号默认的是8000端口。在局域网中使用web去访问http:/IP:8000即可

脚本使用

创建脚本文件http-python.sh并赋予可执行权限chmod +x http-python.sh

#!/bin/bash
  
# dirname $0 取得当前执行脚本文件的父目录
scriptpath=$(cd `dirname $0`;pwd)
echo "current script path: $scriptpath"

basepath=`pwd`
echo "current work path: $basepath"

echo "run http-server"
python -m SimpleHTTPServer

Mac环境推荐放置目录/Users/hanlongjie/Develop/Scripts并配置环境变量Path=$Path:/Users/hanlongjie/Develop/Scripts在静态站点目录执行http-python.sh即可完成站点发布

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 要使用Nuxt.js搭建一个静态站点,可以按照以下步骤进行: 1. 创建一个新的Nuxt.js项目。可以使用npx create-nuxt-app命令来创建一个基本的Nuxt.js项目。 2. 在Nuxt.js项目中创建页面。在pages目录下创建Vue.js文件,每个文件将对应站点中的一个页面。 3. 配置Nuxt.js生成静态站点。在nuxt.config.js文件中配置generate选项,指定需要生成的静态站点的路由和其他选项。 4. 运行npm run generate命令来生成静态站点。这将在dist目录下生成静态站点的文件。 5. 将生成的静态站点上传到Web服务器或静态站点托管服务中,即可将站点部署到互联网上。 以上是使用Nuxt.js搭建静态站点的基本步骤,可以根据需要进行更多的配置和定制。 ### 回答2: Nuxt.js是一个基于Vue.js的开源框架,可以帮助我们快速搭建起一个静态站点。 首先,我们需要安装Nuxt.js。可以通过npm工具在命令行中运行以下命令来进行安装: ``` npm install -g create-nuxt-app ``` 安装完成后,我们可以使用create-nuxt-app命令来创建一个新的Nuxt.js项目: ``` create-nuxt-app my-static-site ``` 运行上述命令后,系统会提示我们选择Nuxt.js的一些配置选项,例如应用名称、项目描述、UI框架等等。选择完毕后,系统会自动帮我们创建好项目的文件结构。 接下来,我们需要在项目中创建一些静态页面。在Nuxt.js中,我们可以在`pages/`目录下创建.vue文件,每个.vue文件对应一个我们想要生成的静态页面。 例如,我们在`pages/`目录下创建一个名为`index.vue`的文件,内容如下: ```vue <template> <div> <h1>Welcome to my static site</h1> <p>This is the homepage of my static site. Enjoy!</p> </div> </template> ``` 通过这样的方式,我们可以在`pages/`目录下创建多个.vue文件,并编写对应的HTML代码来构建我们所需的静态页面。 最后,我们需要通过命令行运行以下命令来生成静态站点: ``` npm run generate ``` 运行上述命令后,系统会根据我们在`pages/`目录下创建的.vue文件生成对应的HTML文件,并将这些HTML文件保存在项目的`dist/`目录下。 至此,我们就通过Nuxt.js成功搭建了一个静态站点。我们可以将`dist/`目录下生成的HTML文件上传到服务器上,通过访问对应的URL来浏览我们搭建的静态站点。 ### 回答3: Nuxt.js 是一个基于 Vue.js 的通用应用框架,它可以帮助我们快速、高效地搭建静态站点。 首先,在电脑上安装好 Node.js 环境。然后,我们可以使用 npm 或者 yarn 安装 Nuxt.js,命令如下: ``` npm install -g create-nuxt-app # 或者 yarn global add create-nuxt-app ``` 安装完成后,我们可以使用 create-nuxt-app 命令创建一个新的 Nuxt.js 项目,命令如下: ``` create-nuxt-app my-static-site ``` 接下来,根据命令行的提示进行配置选择。一般来说,我们选择静态站点的模板和一些其他配置选项,然后等待创建完成。 创建完成后,进入到新创建的项目目录,运行以下命令启动 Nuxt.js 服务器: ``` npm run dev # 或者 yarn dev ``` 此时,我们可以在浏览器中访问 http://localhost:3000 查看项目运行情况。同时,我们可以在项目目录中的 `pages` 文件夹下创建和编辑页面,Nuxt.js 会自动根据页面的目录结构生成路由和对应的静态页面。 接着,我们可以继续编辑页面,包括添加样式、处理数据请求等。同时,我们可以使用 Nuxt.js 提供的插件系统来增强项目的功能。 最后,当我们完成了所有的页面编写和功能开发后,可以使用以下命令生成静态站点的文件: ``` npm run generate # 或者 yarn generate ``` 生成的静态站点文件会存放在项目目录的 `dist` 文件夹中,我们可以将这些文件部署到任何支持静态文件访问的服务器上。 总之,Nuxt.js 提供了便捷的方式来搭建静态站点。我们只需要使用一些简单的命令和编辑页面代码,就能快速地创建和部署一个功能完善的静态站点

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值