Tag: css

为什么使用grunt-contrib-cssmin正在改变我的CSS而它应该只是缩小: 我正在使用grunt-contrib-cssmin来缩小我的css文件。我认为这个工具（grunt-contrib-cssmin）只是一个clean-css的包装。一切都很好，除了这个咕噜插件正在改变我的CSS。我试图使用从clean-css存储库中find的每个选项，但没有任何工作。请帮助我这个东西是杀了我！ Grunt文件： module.exports = function (grunt) { 'use strict'; // Project configuration grunt.initConfig({ // Metadata pkg: grunt.file.readJSON('package.json'), cssmin: { options: { keepSpecialComments:'1', processImport: false, roundingPrecision: -1, shorthandCompacting: false, aggressiveMerging: false, advanced: false, }, minified_css_admin: { src: ['public/admin/css/style.default.css','public/admin/prettify/prettify.css','public/admin/css/bootstrap-fileupload.min.css','public/admin/css/developer.css'], dest: 'public/admin/css/minified-css-admin.min.css', }, }, }); // These plugins provide necessary tasks grunt.loadNpmTasks('grunt-contrib-cssmin'); // Default […]

手写笔内嵌SVG数据uri没有base64编码: 如何在不使用SVG进行Base64编码的情况下使用Stylus预处理器在CSS中embeddedSVG数据uri？喜欢这个： background: url('data:image/svg+xml;utf8,<svg>[…]</svg>'); 而不是这个： background: url('data:image/svg+xml;base64,PD94bWwg[…]'); 通常我用stylus.url()embedded图像，但它也将Base64编码SVG。我想使用数据uris而不是外部文件来保存文件请求。而且我意识到，Base64编码的SVG实际上是增加了字节，而不是减小大小。我找不到embeddedSVG的方法。

如何在`express-js`中使用`less`来缩小CSS？: app.use(express.compiler({ src: __dirname + '/public', enable: ['less'] })); 这是我的app.js中的行less启用。我怎样才能把{ compress: true }parameter passing给它呢？

如何使用Grunt的stylelint？: 我试图用stylelintreplacegrunt-scss-lint （因为它的Ruby依赖性和没有安装gem的无提示失败）。我遇到的问题是以下错误： $ grunt Loading "Gruntfile.js" tasks…ERROR >> ReferenceError: Map is not defined 我认为这是因为stylelint（这是一个PostCSS插件，而不是一个Grunt插件）需要ES6。这是抛出Map is not defined错误的代码。有没有办法让这个工作，我可以运行grunt而不是像这样一些奇怪的解决方法？

PhantomJS：外部CSS在呈现的pdf中被忽略: 我正在使用phantom模块的nodejs从html生成pdf。首先，我读了html模板，并用数据填充它，并将其呈现为pdf。我想使用引导CSS来风格的页面，但风格是任何结果pdf文件中的任何内容。这里是我的JavaScript代码： var phantom = require('phantom'); var htmlTemplate; fs = require('fs') fs.readFile('template.html', 'utf8', function (err,data) { var htmlTemplate = populateTemplate(data, body) phantom.create(function(ph){ ph.createPage(function(page) { page.set("paperSize", { format: "A4", orientation: 'portrait', margin: '1cm' }); page.setContent(htmlTemplate, "", function(){ page.render("../userdata/test.pdf", function(){ console.log("page rendered"); ph.exit(); }); }); }) }); }); 和html模板（简单）看起来像这样： <!DOCTYPE html> <html> <head> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.5/paper/bootstrap.min.css", […]

onClick处理程序不注册ReactDOMServer.renderToString: 我试图复制这个小提琴： http : //jsfiddle.net/jhudson8/135oo6f8/ （我也试过这个例子http://codepen.io/adamaoc/pen/wBGGQv和存在相同的onClick处理程序问题）并使用ReactDOMServer.renderToString使小提琴工作服务器端渲染我有这个电话： res.send(ReactDOMServer.renderToString(( <html> <head> <link href={'/styles/style-accordion.css'} rel={'stylesheet'} type={'text/css'}></link> </head> <body> <Accordion selected='2'> <AccordionSection title='Section 1' id='1'> Section 1 content </AccordionSection> <AccordionSection title='Section 2' id='2'> Section 2 content </AccordionSection> <AccordionSection title='Section 3' id='3'> Section 3 content </AccordionSection> </Accordion> </body> </html> ))); Accordion元素看起来像这样： const React = require('react'); const fs = require('fs'); […]

在项目中使用Node.js作为独立的LESS编译器？: 我一直试图将lessc编译器合并到Bootstrap基本设置的大型项目中，只会导致各种编译器（对于每个人都有不同的解决scheme）。没有一个解决scheme给我我想要的东西，这是一种通过命令行编译更less堆的方法。我通过node.js编译了各种其他的资源，希望能够做到同样的事情，但是我在这个主题上find的每一个googlepage都是Node.js + Express，这不是我想要的。我想要一个独立的编译器。（想法：require.js r.js文件）我发现无节点，但它没有看到在2年的更新，因此并不理想。所以。问题：有没有一种命令行方式来编译带有node.js的较less文件？理想的impl： node compiler.js build.js 其中build.js是一个文件pathbootstrap.less和其他一切需要。 r.jsconfiguration文件的示例： ({ baseURL : "../assets", mainConfigFile : "../assets/main.js", name : "../assets/main", out : "../assets/main.optmin.js", optimize : "uglify" })

如何自动testing我的webpack捆绑网站对付FUOC？: 我已经构build了一个与webpack捆绑在一起的React + Redux Web。由于绑定错误，我的网站开始显示FUOC行为（有些组件没有将其CSS注入到服务器响应中，因此在加载最终的CSS之前，应用程序的未被devise的部分会“闪现”）。其他错误包括第三方组件的FUOC（这需要手动工作）。我有自动testing的服务器和我的networking的不同部分。但是，如何自动testingFOUC（使用我的node.js工具链）呢？我想到selenium和幻影，但这似乎是一个矫枉过正，我仍然不知道如何能够发现它。

如何引用通过npm安装的库的CSS？: 所以比如说我安装了一些东西： npm install –save something 并下载到 ./node_modules/something/ 它有一个文件夹，也许有所谓的styles并在该文件夹中有something.css 。我将如何包括该CSS文件在我的HTML文档（如果我的HTML文档沿着 – node-modules文件夹？我的意思是我可以在我的HTML头做这个： <link rel="stylesheet" href="./node_modules/something/styles/something.css" type="text/css" media="screen" /> 但是在你的node_modules目录中寻找东西感觉不对。特别是如果html文件可能需要被缩小，然后扔进一些./dist/目录。因为那么something.css的path是closures的.. 没有办法简单地去： <link rel="stylesheet" href="something.css" type="text/css" media="screen" /> 在你的html文档中 – 不pipe它在哪里坐在你的项目结构 – 它只会知道去哪里find该CSS文件？

脚本没有被调用: 我正在使用ExpressJS。我的脚本或CSS将不会加载。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/> <meta name="apple-mobile-web-app-capable" content="yes"/> <meta name="apple-mobile-web-app-status-bar-style" content="black"/> <title>Customer Info</title> <link rel="stylesheet" href="/stylesheets/testing.css" type="text/css" media="screen" charset="utf-8"/> <script type="text/javascript" src="/javascripts/jquery-1.9.1.js"></script> <script src="/javascripts/jquery-ui-1.10.2.custom.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript" src="/javascripts/testing.js"></script> </head> <body> //body contents </body> </html> 我知道问题不在于地点。当我以快速渲染这个EJS视图时，没有任何脚本正在加载。我不明白为什么它会为几乎相同的观点工作，但不是这个。有任何想法吗？