Tag: sass

为什么Node-sass不能将我的scss编译到Node / Express.js中的css中

我对Node.js和Express.js非常陌生。 我希望能够使用SCSS而不是Stylus。 我已经安装了node-sass到我的node-modules，并将其包含在我的package.json文件中。 然后我将下面的代码添加到我的app.js文件中： var sass = require('node-sass'); app.use(sass.middleware({ src: __dirname + '/public', dest: __dirname + '/public', debug: true })); 问题是没有什么是编译。 我在命令行中遇到500错误。 见下文 GET / 304 135ms source : /Users/chrisdacie/Sites/express_example/public/stylesheets/base.scss dest : /Users/chrisdacie/Sites/express_example/public/stylesheets/base.css read : /Users/chrisdacie/Sites/express_example/public/stylesheets/base.css … GET /stylesheets/style.css 304 4ms undefined GET /stylesheets/base.css 500 33ms 任何帮助将不胜感激。 我真的不想使用手写笔。

从父目录node-sass导入

我使用node-sass来模拟我的CDN构build，并将我的CSS转换为模块化的Sassdevise。 基本上我的设置涉及品牌网站覆盖常见的风格。 我想在品牌文件夹中做这样的事情 @import "../common/global-config"; @import "brand-config"; @import "../common/common"; // brand specific styles here 这个文件将位于/css/brand-name/brand.scss 其他文件将in /css/common/_common.scss 我的节点sass设置看起来像这样 function compileSassFile(includes, path, callback) { if (!fs.existsSync(path)) { return null; } var css = sass.renderSync({ file: path, success: callback, outputStyle: 'expanded', includePaths: includes }); return css; } // bundlePath = 'css', dirName = '/brand-name' compileSassFile([path.join(bundlePath), path.join(bundlePath, 'common'), […]

咕噜咕噜地看着咖啡和玉石文件

我想同时观看我的咖啡和咕噜声文件。 当我只是看咖啡文件没有问题，但是当我添加一个玉观察员到我的文件观察员只编译一次 ，虽然有一个更新，观察员没有编译这些新的更新。 任何帮助表示感谢： 这里是我的系统中只有咖啡监视器的时候： 每当咖啡文件有更新时编译： Gruntfile.coffee module.exports = (grunt) -> grunt.initConfig pkg : grunt.file.readJSON "package.json" coffee : compile : options : sourceMap: on files : ['dist/client/js/main.js': 'client/app/scripts/app.coffee', 'server.js': 'server.coffee'] watch : coffee : options : atBegin: yes files : [ 'client/scripts/*.coffee', 'client/scripts/controllers/*.coffee', 'server.coffee'] tasks : ['coffee', 'jade'] grunt.loadNpmTasks 'grunt-contrib-coffee' grunt.loadNpmTasks 'grunt-contrib-watch' grunt.registerTask 'default', ['watch'] […]

grunt-sass缩小的CSS Sourcemap不正确

所以我用grunt-sass来编译我的sass，但是我遇到了一个问题。 sass: { options: { outputStyle: 'compressed', sourceMap: true }, dist: { files: { '<%= pkg.dir.css %>/styles.css': '<%= pkg.dir.sass %>/styles.scss' } } }, 一切都很好，但创build的源代码将CSS指向完全不正确的位置。 如果css没有被缩小，这个工作就很好。 有没有人遇到过这个问题，或者对这个问题有什么想法？

SASS Watch包的Atom编译失败

我已经安装了Atom和Node.js，将节点path添加到系统variables中，重新启动，然后将SASS Watch包添加到Atom，当我尝试编译SASS文件时，出现此错误。 C：\ Windows \ system32 \ cmd.exe / s / c“C：\ Users \ MYUSER \ .atom \ packages \ sass-watch \ node_modules.bin \ node-sass”C：\ Users \ SASS Compile Failed Command failed： MYUSER \ Desktop \ project \ style.scss“”C：\ Users \ MYUSER \ Desktop \ project \ style.css“”节点“不被识别为内部或外部命令，可操作程序或batch file。 我已经读了它，它应该是我的path问题。 但是我已经尝试了一切，但仍然无法修复。 你能帮我吗？ 我想用Atom取代Netbeans，但Netbeans是目前唯一的一个。

通过Git部署简单的SPA到Azure

我只是一个简单的Angular应用程序，我试图通过Git推到Azure。 我修改了我的deploy.sh文件来运行npm install bower install和grunt build ，但是它build立到一个名为dist的目录。 Azure似乎并没有采取，所以我怎么让他们来主持呢？ 我是否需要将Express服务器指向dist或其他？

Grunt从sass输出

我在OS X上通过PHPStorm 8的terminal运行。 我只是做了一个新的node.js和凉亭和咕噜安装。 我已经在另外两台OS X机器上完成了这个任务，没有任何麻烦。 由于某些原因，grunt正在编译我的SCSS文件到： [object Object] 它可以在我的台式机和其他笔记本电脑上运行，运行所有相同的版本。

Grunt – 在dev中编译并导入单独的sass，但在编译时连接它们

所以我有一个包含许多scss文件的文件夹。 我曾经把@import全部导入一个大的main.scss文件。 但随着时间的推移，文件变大了，整个文件重新编译之后，现在需要20多秒才能看到变化的结果。 我想使用Grunt来观察scss文件，只重新编译一个已经改变的文件，然后用grunt serve刷新页面。 在dev中，html页面应该包含与scss文件一样多的<link>标签。 在prod中，我想能够将它们连接成一个类似grunt build main.css文件 此外，请注意，我有一些variables.scss文件，可能在任何部分中使用。 所以他们也应该可以访问这些variables。 我不知道从哪里开始。 任何帮助将非常感激。

grunt-newer不能用grunt-sass工作

我正在尝试使用grunt-newer来更改我的sass部分，然后运行grunt-sass任务。 出于某种原因，似乎没有注册任何更新。 哎呀！ 示例目录结构： sass – components _breadcrumb.scss – helpers _variables.scss main.scss Sassconfiguration： files: [{ expand: true, cwd: 'static/sass', src: ['*.scss'], // src: ['**/*.scss'], dest: 'static/styles', ext: '.css' }] main.scss包含用于读取部分的@imports。 运行grunt newer：sass将查找对main.scss的更改。 更新globbing规则以使用** / *。scss在任何文件中根本不会进行任何更改。 这感觉就像一个混乱的问题，但我不能破解它。 任何帮助，将不胜感激。

使用webpack渲染节点服务器上的组件

我有一个反应组件。 <myFooter> 。 这是一个简单的页脚。 import React from 'react'; import './my-footer.scss'; export default class myFooter extends React.Component { render() { return ( <footer className="col-xs-12"> hello ! </footer> ); } } 我想从服务器端渲染它。 在后端，我有一个快递服务器。 为此我写了这个： import myFooter from '../components/my-footer.jsx'; app.get('/footer', function(req, res) { var string1 = ReactDOMServer.renderToString(myFooter); res.send(string1); }); 现在的问题是服务器无法读取sass文件。 对于客户端渲染，我使用的是webpack。 Webpack构build一切，并提供一个包文件。 但我不知道如果它的服务器端发生了什么。 我怎样才能编译使用webpack。 如果可以的话，我是否需要为节点服务器上的每个请求编译我的应用程序？