Tag: css

如何避免使用webpack这个硬编码的index.js？

任务： CSS ：编译.scss，添加前缀，缩小和concat到main.css中 JS ： minify和concat到main.js中 我们正在使用webpack和BEM。 项目结构： static/ ├── build │ ├── main.css │ └── main.js └── src ├── blocks │ ├── a │ │ ├── a.js │ │ └── a.scss │ ├── b │ │ └── b.scss │ ├── c │ │ └── b.scss │ └── d │ ├── d.js │ └── d.scss […]

警告：找不到任务“taskname”。 运行咕噜声时使用–force继续

我正在尝试使用'grunt-sass-convert'npm模块将.css文件转换为.sass文件。 ' Gruntfile.js '相同如下： 'use strict'; module.exports = function(grunt){ grunt.loadNpmTasks('grunt-sass-convert'); grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), Sass: { options: { // command line options here style: 'expanded', from: 'css', to: 'sass' }, files: { // Target-specific file lists and/or options go here. cwd: 'style', src: '*.css', filePrefix: '_', dest: 'sass/' } } }); grunt.registerTask('default',['Sass']); }; 我提到了grunt-sass-convert npm模块文档来编写GruntFile.js文件。 在cmd中运行grunt命令时，出现以下错误： […]

如何使用node.js在html中包含静态文件

这不是一个关于express.static（）的问题 我有一个应用程序，我需要服务多个页面具有相同的JS和CSS依赖关系。 因此，编写css和js包括在每个页面上使用<script>或<link>标签是不好的做法。 我正在寻找一个类似php的方式来做到这一点。 由于PHP会处理所有的PHP代码，并发送编译的HTML，我想同样可以用js在节点服务器上完成。 所以服务器会有点像下面这样： 从resources.html获取html 把html上面的html推到index.html 发送index.html 或者也许还有其他的方法。 任何想法？

使用Express.js提供纯文本SVG（与Cheerio.js相关的解决scheme）

我正在尝试在通过Express.js发送之前处理SVG。 我有以下代码： app.get("/iconic/styles/:style/:base/:icon", function (req, res) { var style = req.params.style; var base = req.params.base; var icon = req.params.icon; var iconPath = path.join(iconFolderRoot, style, icon); svgProcessor(iconPath, base).then(function (svg) { //console.log(svg); // SO: See the example output posted below res.header("Content-Type","image/svg+xml"); //res.send(new Buffer(svg, 'binary')); // No difference res.send(svg); }).catch(function (err) { res.status(404).send("Error" + JSON.stringify(err, null, " ")); […]

在本地主机服务器上找不到png文件

错误代码http：// localhost：3000 / public / resource / calendar.png加载资源失败：服务器响应状态为404（未find） 我想要Web服务。 我不知道为什么这个错误。 它在本地文件中运行良好，但是从nodejs开始这个错误 错误 这是我的来源 app.js var express = require('express'), app = express(), server = require('http').createServer(app), io = require('socket.io').listen(server); server.listen(3000); app.get('/', function(req, res){ res.sendFile(__dirname + '/index.html'); }); index.html（来源太长） 这是错误代码 text-align: center; background: url('./public/resource/calendar.png'); background-size: contain; 而png文件path是D：\ Hackathon \ public \ resource 和app.js，索引path是D：\ Hackathon 帮助我PLZ

ExpressJs：在视图上使用Navbar

我使用ExpressJS和EJS作为我的视图。 在我的导航栏中，当用户在当前页面上时，我有链接需要有一个class="active" 。 如果我在我的意见中使用partials。 我该怎么做呢？ 样品 Index.ejs <ul class="nav navbar-nav navbar-right"> <li><a class="active" href="/Index">Home</a></li> <li><a href="/About">About</a></li> <li><a href="/Work">Work</a></li> </ul> About.ejs <ul class="nav navbar-nav navbar-right"> <li><a href="/Index">Home</a></li> <li><a class="active" href="/About">About</a></li> <li><a href="/Work">Work</a></li> </ul> Work.ejs <ul class="nav navbar-nav navbar-right"> <li><a href="/Index">Home</a></li> <li><a href="/About">About</a></li> <li><a class="active" href="/Work">Work</a></li> </ul> 这是我的做法！通过做一个navbar每次我做一个新的一页 我应该怎么做，当我渲染一个新的页面是不需要再次渲染导航栏？

使用$ routeProvider是否节省networking带宽？

考虑这个$routeProviderconfiguration的navbar 并假定没有caching app.config(function($routeProvider) { $routeProvider .when('/', { templateUrl : 'pages/home.html', controller : 'mainController' }) .when('/about', { templateUrl : 'pages/about.html', controller : 'aboutController' }) .when('/contact', { templateUrl : 'pages/contact.html', controller : 'contactController' }); }); 我在网上阅读，单页应用程序的优势之一是networking带宽，因为它不需要每次切换页面时传输HTML标签。 但是，当我们有以上的情况navbar有家，关于联系，被路由到单独的页面，是不是每次都必须传输HTML标签？ 它是否通过消除HTML标签传输来节省networking带宽？

jQuery底部固定div切换向上移动所有div

我正在与节点JS和我们build立一个完美的聊天，现在我们正在移动到它的CSS部分。 现在我现在遇到的问题是，当我们有多个选项卡，并且只点击一个选项卡时，所有的选项卡都会向上移动。 这可以在下面的图像中查看。 红色区域是标签所显示的div ，它们应该可以通过CSS向下移动 之前 点击1个标签后 再次点击一个标签，告诉你我有正确的jQuery部分 这是一个坐在页面底部的固定div 下面的代码对每个选项卡都重复，但是使用不同的ID，如图所示的tramsTalk ， Calvin ， srcc-test 。 <div style="position:fixed;bottom:0;right:26px;background-color:red;"> <div id="tramsTalk_chat" style="background-color:white;position:relative;bottom:0px;width:275px;float:right"> <div id="tramsTalk_chat_header" class="chat_header"><p><i class="icon-chevron-up icon-white pull-right"></i>tramsTalk</p></div> <div class="overflow_chat" id="tramsTalk_chat_textarea"><hr style="margin-top:-8px;margin-bottom:1px;"></div> <div class="chat_textarea_holder" id="tramsTalk_msg_textarea_holder"><textarea class="chat_box" rows="3" id="tramsTalk_msg" ignoreesc="true" name="tramsTalk_chat_message" onkeyup="check(this,event);" style="resize: none; overflow-y: hidden; "></textarea></div> </div> </div> 我认为这将工作，它仍然保持顶部的标签。 只是为了重申： jQuery工作正常，我们切换，但移动标签应该仍然被固定在底部。 （我可以点击它们，然后他们将拉下文本框）。 我认为CSS是问题，我不确定。 解 <style> .wrappers > […]

Nodejs：服务的HTML页面没有链接到CSS

我有以下的基本脚本运行在nodejs提供一个HTML文件与关联的CSS样式表： var http = require('http'); var fs = require('fs'); var path = require('path'); var serverPort = 8080; var server = http.createServer(function(request, response) { console.log('request starting …'); var extname = path.extname(request.url); var contentType = 'text/html'; switch (extname) { case '.js': contentType = 'text/javascript'; break; case '.css': contentType = 'text/css'; break; } fs.readFile('js/EmailDisplay/htm/index.html', function(error, content) { if […]

JavaScript中的LESS似乎蹒跚作响：解决方法？

我发现LESS有一个懒散的JavaScript评估器，至less是我使用它的方式，也就是在将客户端上传到Web服务器之前，将* .less文件编译成* .css文件。 我知道，编译可能更经常在服务器端完成，但为了性能和简单性，我们只需要服务器上的CSS文件。 我正在编译Fedora Linux上的LESS文件，并在这些指令中安装了lessc ruby gem安装到Node Package Manager中。 编译器工作正常，但据我所知，JavaScriptexpression式评估非常有限。 我相信这也适用于基于此发布的服务器端JavaScriptexpression式评估， 这表明了JavaScript引擎如何插入到LESS环境中的不确定性。 我可以使用的只是简单的，逗号分隔的expression式，如下所示： @bar: ` "ignored-string-expression" , 5 `; div.test-thing { content: ~"@{bar}"; } 编译成： div.test-thing { content: 5; } 当我尝试定义一个函数时，编译器barfs（无论expression式中的分号是否反斜线）： [719] anjaneya% cat testfunc.less @bar: `function foo() {return 5}; foo()`; div.test-thing { content: ~"@{bar}"; } [720] anjaneya% lessc testfunc.less SyntaxError: JavaScript evaluation error: […]