我正在尝试让我的金属匠网站使用 Sass,以便我可以将 Foundation 用于网站。我已经成功地让我的网站构建和使用浏览器同步,但不幸的是我的 .scss 文件没有转换为 css。
下面是我的 build.js 文件,我当前的“src”文件结构是这样的。谁能看到我做错了什么。浏览了至少 20 个文件和 tuts,但一无所获,谢谢。
- 源代码
- 资产
- css
- 图片
- 脚本
- html
- 部分
- scss
- _settings.scss
- _custom.scss
- 应用程序.scss
模板
var consoleLog = false, // set true for metalsmith file and meta content logging devBuild = ((process.env.NODE_ENV || '').trim().toLowerCase() !== 'production'), pkg = require('./package.json'), sass = require('metalsmith-sass'), metalsmith = require('metalsmith'), markdown = require('metalsmith-markdown'), watch = require('metalsmith-watch'), layouts = require('metalsmith-layouts'), assets = require('metalsmith-assets'), // Use Browser Sync browsersync = devBuild ? require('metalsmith-browser-sync') : null, // Set up Directories dir = { base: __dirname + '/', lib: __dirname + '/lib/', source: './src/', dest: './build/' }, //Template Config templateConfig = { engine: 'handlebars', directory: dir.source + 'template/', partials: dir.source + 'partials/', default: 'page.html' }; console.log((devBuild ? 'Development' : 'Production'), 'build, version', pkg.version); var ms = metalsmith(dir.base) // instantiate Metalsmith in the cwd .source(dir.source + 'html/') // specify source directory .destination(dir.dest) // specify destination directory .use(markdown()) // transpile markdown into html .use(layouts(templateConfig)) // layout templating .clean(true) .use(watch({ paths: { './src/**/*.md': '**/*', './src/template/**/*': '**/*', './src/scss/*.scss': '**/*' } })) .use(sass({ file: './src/scss/*.scss', includePaths : ['./node_modules/foundation-sites/scss'], outputDir: './src/assets/css/', outputStyle: "expanded" })) .use(assets({ // copy assets: CSS, images etc. source: dir.source + 'assets/', destination: './' })); if (browsersync) ms.use(browsersync({ // start test server server: dir.dest, files: [dir.source + '**/*'] })); ms.build(function(err) { // this is the actual build process if (err) throw err; // throwing errors is required });