在这个超快的屏幕录制中,我们使用 MAMP 来设置一个用于本地开发的 URL。这在很多方面很有用。
background: url(/images/something.jpg);
如果没有 MAMP,请将此行添加到 /etc/host 文件中
127.0.0.1 v10.whatup
编辑 Apache 配置 (/etc/apache2/extra/httpd-vhosts.conf)
ServerName localhost NameVirtualHost *:80
# Edit for global localhost <Directory "/Users/username/Website/html"> Options Indexes FollowSymLinks MultiViews AllowOverride None Order allow,deny Allow from all </Directory> <VirtualHost *:80> ServerAdmin [email protected] DocumentRoot "/Users/username/Website/html" ServerName localhost ErrorLog "/Users/username/Website/log/localhost-error_log" CustomLog "/Users/username/Website/log/localhost-access_log" common </VirtualHost>
# Edit for particular virtual host (v10.whatup like video example) <Directory "/Users/chriscoyier/Dropbox/CSS-Tricks/v10/In Prog/static"> Options Indexes FollowSymLinks MultiViews AllowOverride None Order allow,deny Allow from all </Directory> <VirtualHost *:80> ServerAdmin [email protected] DocumentRoot "/Users/chriscoyier/Dropbox/CSS-Tricks/v10/In Prog/static" ServerName v10.whatup ErrorLog "/Users/username/Website/log/v10.whatup.name-error_log" CustomLog "/Users/username/Website/log/v10.whatup.name-access_log" common </VirtualHost>
最后,要激活它,请将此行添加到 /etc/apache2/httpd.conf 文件中
Include /private/etc/apache2/extra/httpd-vhosts.conf
…然后使用终端命令重启 Apache
$ sudo apachectl restart
我简直是经历了 3 天的地狱,卡在这个过程中。显然,新约定要求行顺序为 allow, denyallow from all
to
require all granted
瞧,我现在可以继续了 :)
对于那些没有 MAMP Pro 或其他任何提供良好 GUI 来创建本地 URL 的工具的其他人,您可以通过编辑 hosts 文件手动执行此操作。
– Mac: /private/etc/hosts– Windows: /system32/drivers/etc/hosts
将新的记录添加到 hosts 文件的底部,格式如下。
接下来,打开 apaches 的“httpd-vhosts.conf”文件,您可能需要四处寻找该文件,但它在我的安装中就在这里(标准的 Mac 版 MAMP)。– /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf
<VirtualHost *:80> DocumentRoot "/Applications/MAMP/htdocs/css-tricks/v10" ServerName v10.whatup </VirtualHost>
**DocumentRoot 应该是您网站的路径**
点击保存,然后重新加载 Apache。您现在应该可以通过 http://v10.whatup 访问您的网站。
哦,Nelson 比我早 :(
按照所有步骤操作(使用免费版 mamp)后,我收到此消息。知道为什么吗?禁止您没有权限在此服务器上访问 /。此外,在尝试使用 ErrorDocument 处理请求时,遇到了 403 Forbidden 错误。
当我下载文件时,下载进度没有移动,我通常会下载它,因为缓冲此页面上的视频确实需要时间,而且即使有些视频只有 10-15 分钟,这些文件也相当大 :(
最佳结果 == 在点击下载按钮之前刷新页面。
对于那些拥有 MAMP Pro 并希望能够从其他设备(如手机/平板电脑)访问您的网站的人,请使用 ServerAlias 来设置您的开发网站,例如:;
ServerAlias mysite.*.xip.ioServerAlias mysite.whatup
然后,如果您在同一个网络上拿出您的手机/平板电脑等,然后访问 mysite.(您的服务器 IP 地址).xip.io,它将加载该网站。
例如,我的将是 mysite.192.168.0.100.xip.io – 如果您使用的是 Adobe Shadow 和 Chrome,这也很棒,因为您可以进行远程调试。
只是对上述内容的补充。如果您通过 mysite.192.xxx.yyy.zzz.xip.io 访问网站,请确保如果使用 WordPress(例如),您的 siteurl/wordpress URL 在您的 SQL 中设置了它,否则您将遇到问题,因为 WordPress 会将所有 URL 等设为相对于 mysite.whatup,而不是您输入的域名。
Safari 6 还可以让您使用检查器与 iOS 上的 Safari 进行交互……至少在 iOS 6 上。
我刚刚获得了 mamp pro – 因为我认为它很酷。当我安装它时,mysql 无法工作,而且我需要输入 mywebsite.v1:8888,而不是 mywebsite.v1 来访问网站。
是否有快速解决方法?我还没有删除免费版的 mamp。谢谢
将 Apache 端口更改为 80。我认为这应该可以解决问题。
http://cl.ly/JUrU
非常感谢
嗨,Chris,在 MAMP 中简单地将端口更改为“标准”(80,3306)会导致与标准 Apache 冲突(至少在我的系统中是这样)。但找到了这篇好文章 在 MAMP 或 MAMP Pro 中使用端口 80 localhost 运行 Apache,它实际上对我来说非常有效。(……而且我通常在使用终端时会遇到麻烦 uahhh)对于所有那些想知道您在终端中输入密码时没有看到任何活动的人:这是标准行为(没有人可以偷看您的密码)– 只需输入并按回车键即可。干杯,托马斯。
这个视频似乎放错了地方,应该作为 #015 更好,因为它接上了 #014 的内容。视频 #015 和 #016 添加了图标字体和媒体查询,但这些内容在这个视频中没有出现。仅仅是我的想法……
我也有同样的想法。
只是想评论一下,以防其他人可能正在排查问题。
使用 MAMP Pro 时,一个小而可能很重要的东西。我花了 2 天时间才意识到 MAMP Pro 不会提供扩展名为 .htm 的页面 – 说真的,我对 Chris 如何在视频中轻松地做到这一点感到困惑,但我唯一能让我的页面在浏览器中显示的方法是使用 index.php 并将 index.htm 页面作为包含文件放进去。
在此之前,每当我尝试使用 Mamp Pro 打开服务器时,都会收到“您没有权限在此服务器上访问 /”的消息。当我将 index.htm 更改为 index.html 后,实际页面就出现了。希望有人会发现这很有用。
页面加载时,是否有简单的方法可以解决字体闪烁问题?
同样,我也可以浏览其他视频,但页面加载时字体闪烁的解决方法是什么?
1) 如果您使用常规的 TypeKit 嵌入代码,则无需担心。
2) 如果您使用异步代码,您只需要将一个名为 wf-loading 的类添加到您的 HTML 元素,然后定位使用该字体的元素,并将 visibility: hidden; 设置为它们,直到该类消失(TypeKit JS 会执行此操作)。
http://help.typekit.com/customer/portal/articles/6852-Controlling-the-Flash-of-Unstyled-Text-or-FOUT-using-Font-Events
Your email address will not be published. Required fields are marked *
Comment *
Name *
Email *
Website
Save my name, email, and website in this browser for the next time I comment.
Copy and paste this code: micuno *
Leave this field empty
Δ
如果没有 MAMP,请将此行添加到 /etc/host 文件中
编辑 Apache 配置 (/etc/apache2/extra/httpd-vhosts.conf)
最后,要激活它,请将此行添加到 /etc/apache2/httpd.conf 文件中
…然后使用终端命令重启 Apache
我简直是经历了 3 天的地狱,卡在这个过程中。显然,新约定要求行顺序为 allow, deny
allow from all
to
require all granted
瞧,我现在可以继续了 :)
对于那些没有 MAMP Pro 或其他任何提供良好 GUI 来创建本地 URL 的工具的其他人,您可以通过编辑 hosts 文件手动执行此操作。
– Mac: /private/etc/hosts
– Windows: /system32/drivers/etc/hosts
将新的记录添加到 hosts 文件的底部,格式如下。
接下来,打开 apaches 的“httpd-vhosts.conf”文件,您可能需要四处寻找该文件,但它在我的安装中就在这里(标准的 Mac 版 MAMP)。
– /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf
**DocumentRoot 应该是您网站的路径**
点击保存,然后重新加载 Apache。您现在应该可以通过 http://v10.whatup 访问您的网站。
哦,Nelson 比我早 :(
按照所有步骤操作(使用免费版 mamp)后,我收到此消息。知道为什么吗?禁止
您没有权限在此服务器上访问 /。
此外,在尝试使用 ErrorDocument 处理请求时,遇到了 403 Forbidden 错误。
当我下载文件时,下载进度没有移动,我通常会下载它,因为缓冲此页面上的视频确实需要时间,而且即使有些视频只有 10-15 分钟,这些文件也相当大 :(
最佳结果 == 在点击下载按钮之前刷新页面。
对于那些拥有 MAMP Pro 并希望能够从其他设备(如手机/平板电脑)访问您的网站的人,请使用 ServerAlias 来设置您的开发网站,例如:;
ServerAlias mysite.*.xip.io
ServerAlias mysite.whatup
然后,如果您在同一个网络上拿出您的手机/平板电脑等,然后访问 mysite.(您的服务器 IP 地址).xip.io,它将加载该网站。
例如,我的将是 mysite.192.168.0.100.xip.io – 如果您使用的是 Adobe Shadow 和 Chrome,这也很棒,因为您可以进行远程调试。
只是对上述内容的补充。如果您通过 mysite.192.xxx.yyy.zzz.xip.io 访问网站,请确保如果使用 WordPress(例如),您的 siteurl/wordpress URL 在您的 SQL 中设置了它,否则您将遇到问题,因为 WordPress 会将所有 URL 等设为相对于 mysite.whatup,而不是您输入的域名。
Safari 6 还可以让您使用检查器与 iOS 上的 Safari 进行交互……至少在 iOS 6 上。
我刚刚获得了 mamp pro – 因为我认为它很酷。当我安装它时,mysql 无法工作,而且我需要输入 mywebsite.v1:8888,而不是 mywebsite.v1 来访问网站。
是否有快速解决方法?我还没有删除免费版的 mamp。
谢谢
将 Apache 端口更改为 80。我认为这应该可以解决问题。
http://cl.ly/JUrU
非常感谢
嗨,Chris,在 MAMP 中简单地将端口更改为“标准”(80,3306)会导致与标准 Apache 冲突(至少在我的系统中是这样)。但找到了这篇好文章 在 MAMP 或 MAMP Pro 中使用端口 80 localhost 运行 Apache,它实际上对我来说非常有效。(……而且我通常在使用终端时会遇到麻烦 uahhh)对于所有那些想知道您在终端中输入密码时没有看到任何活动的人:这是标准行为(没有人可以偷看您的密码)– 只需输入并按回车键即可。干杯,托马斯。
这个视频似乎放错了地方,应该作为 #015 更好,因为它接上了 #014 的内容。视频 #015 和 #016 添加了图标字体和媒体查询,但这些内容在这个视频中没有出现。仅仅是我的想法……
我也有同样的想法。
只是想评论一下,以防其他人可能正在排查问题。
使用 MAMP Pro 时,一个小而可能很重要的东西。我花了 2 天时间才意识到 MAMP Pro 不会提供扩展名为 .htm 的页面 – 说真的,我对 Chris 如何在视频中轻松地做到这一点感到困惑,但我唯一能让我的页面在浏览器中显示的方法是使用 index.php 并将 index.htm 页面作为包含文件放进去。
在此之前,每当我尝试使用 Mamp Pro 打开服务器时,都会收到“您没有权限在此服务器上访问 /”的消息。当我将 index.htm 更改为 index.html 后,实际页面就出现了。希望有人会发现这很有用。
页面加载时,是否有简单的方法可以解决字体闪烁问题?
同样,我也可以浏览其他视频,但页面加载时字体闪烁的解决方法是什么?
1) 如果您使用常规的 TypeKit 嵌入代码,则无需担心。
2) 如果您使用异步代码,您只需要将一个名为 wf-loading 的类添加到您的 HTML 元素,然后定位使用该字体的元素,并将 visibility: hidden; 设置为它们,直到该类消失(TypeKit JS 会执行此操作)。
http://help.typekit.com/customer/portal/articles/6852-Controlling-the-Flash-of-Unstyled-Text-or-FOUT-using-Font-Events