是的。但由于 Sass/SCSS,存在一些限制。
默认情况下,Foundation 使用 Compass 进行 SCSS 编译。但是,Sass 和 Compass 都是用 Ruby 编写的,Azure 网站不支持 Ruby。 (Azure 网站当前支持.NET、Node.js、PHP 和 Python http://www.windowsazure.com/en-us/documentation/services/web-sites/。) 跑步compass
从命令行将您的 SCSS 编译为浏览器所需的 CSS 并在 HTML 中引用;此 CSS(实际上是整个样式表目录)未提交到 Git 中。
如果您想手动将应用程序部署到 Azure 网站中,则只需事先运行 Compass,然后推送您的文件,包括生成的文件stylesheet/
目录。但是,我假设您想要运行 Git 部署。
由于 Azure 网站不支持 Ruby,这意味着我们需要一个完全不含 Ruby 的选项。幸运的是,Foundation 已经使用 LibSass 库支持这一点。当您创建新的 Foundation 项目时,请使用--libsass
flag.
foundation new PROJECT_NAME --libsass
而不是跑步compass watch
为了监视和编译您的 SCSS 文件,它使用 Node.js 和 GruntJS。执行grunt
从命令行监控和编译您的 SCSS。 (Watch 和 Build 是 Foundation 的 Grunt 设置的默认任务,因此您无需指定任务名称。)
从那里,你可以使用 Azure CLI 和 Kudu 配置 Azure Git 部署,以执行 Grunt 来编译 SCSS 作为部署的一部分。
安装 Azure CLI
npm install -g azure-cli
然后从 Node.js 部署(为 Grunt 提供支持)开始。
azure site deploymentscript --node
您将需要修改您的部署脚本(deploy.sh
),Azure CLI 生成,以便它将在部署时执行 Grunt。在deploy.sh
,有一个# Deployment
部分。将整个部分替换为以下内容:
# Deployment
# ----------
echo Handling node.js grunt deployment.
# 1. Select node version
selectNodeVersion
# 2. KuduSync to wwwroot
"$KUDU_SYNC_CMD" -v 500 -f "$DEPLOYMENT_SOURCE" -t "$DEPLOYMENT_TARGET" -n "$NEXT_MANIFEST_PATH" -p "$PREVIOUS_MANIFEST_PATH" -i ".git;.deployment;deploy.sh;README.md;"
exitWithMessageOnError "Kudu Sync to Target failed"
# 3. Install npm packages
if [ -e "$DEPLOYMENT_TARGET/package.json" ]; then
eval $NPM_CMD install
exitWithMessageOnError "npm failed"
fi
# 4. Install bower packages
if [ -e "$DEPLOYMENT_TARGET/bower.json" ]; then
eval $NPM_CMD install bower
exitWithMessageOnError "installing bower failed"
./node_modules/.bin/bower install
exitWithMessageOnError "bower failed"
fi
# 5. Run grunt
if [ -e "$DEPLOYMENT_TARGET/Gruntfile.js" ]; then
eval $NPM_CMD install grunt-cli
exitWithMessageOnError "installing grunt failed"
./node_modules/.bin/grunt --no-color build
exitWithMessageOnError "grunt failed"
fi
这将 (1) 安装您需要的所有 npm 软件包(例如node-libsass
),安装您需要的所有 Bower 软件包(例如foundation
),然后运行grunt build
编译你的SCSS。
一个警告
Azure 网站也不支持编译 Node.js 包。它将运行该包,但不会编译它们,因此需要预编译它们,然后提交到 Git 中。这意味着./node_modules/node-sass/**
需要提交到 Git 中。另外:由于模块在 OSX 和 Windows 上的编译方式不同,这意味着您需要从 Windows 计算机提交 node-sass,以便在 Git 中包含该模块的 Windows 编译版本。
不幸的是,如果您尝试从 OSX 开发机器运行此项目,这将导致问题。
所有在LESS下不存在的问题。由于 LESS 起源于 JavaScript 社区而不是 Ruby 社区,因此它的主要解释器采用 JavaScript 语言,并由 Node.js(以及 Azure 网站)原生支持。这些 JavaScript 解释器也不需要编译,因此不需要提交它们的 node_modules。但由于 Foundation 使用 Sass,这些都是您必须跨越的障碍。
并不是说 LESS 没有自己的问题,只是有不同的问题,而不是这些。