使用JS显示随机的css Sprite
使用JS显示随机的CSS Sprite是一种在前端开发中常见的技术，它可以通过JavaScript动态地改变CSS Sprite的位置来实现动画效果或者展示不同的图像。
CSS Sprite是将多个小图标或者图片合并到一张大图中，通过设置background-position属性来显示不同的图标或者图片。使用CSS Sprite可以减少HTTP请求次数，提高网页加载速度，同时也可以减少图标或者图片的文件大小。
下面是实现使用JS显示随机的CSS Sprite的步骤：
- 创建一个包含多个小图标或者图片的CSS Sprite图像，并设置合适的background-position属性。
- 在HTML文件中添加一个用于显示CSS Sprite的元素，例如一个div元素。
- 使用JavaScript获取该元素，并通过修改其style属性中的background-position属性来改变显示的图标或者图片。
- 使用JavaScript生成随机数，根据随机数的值来确定显示的图标或者图片。
以下是一个示例代码：
<!DOCTYPE html>
<html>
<head>
<style>
.sprite {
width: 50px;
height: 50px;
background-image: url(sprite.png);
}
</style>
</head>
<body>
<div class="sprite" id="sprite"></div>
<script>
var spriteElement = document.getElementById("sprite");
var spritePositions = [
"0 0", // 第一个图标或者图片的位置
"-50px 0", // 第二个图标或者图片的位置
"-100px 0" // 第三个图标或者图片的位置
];
function getRandomPosition() {
var randomIndex = Math.floor(Math.random() * spritePositions.length);
return spritePositions[randomIndex];
}
setInterval(function() {
var randomPosition = getRandomPosition();
spriteElement.style.backgroundPosition = randomPosition;
}, 1000); // 每隔1秒切换一次图标或者图片
</script>
</body>
</html>在上述示例代码中，我们创建了一个CSS Sprite图像，其中包含了三个图标或者图片，并将其设置为50x50像素的大小。通过JavaScript代码，我们获取了id为"sprite"的div元素，并使用setInterval函数每隔1秒随机改变其background-position属性，从而实现了显示随机的CSS Sprite的效果。
推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云对象存储（COS）。
- 腾讯云云服务器（CVM）：提供可扩展的云服务器，适用于各种规模的应用程序和工作负载。了解更多信息，请访问：腾讯云云服务器（CVM）
- 腾讯云对象存储（COS）：提供高可靠性、低成本的对象存储服务，适用于存储和处理大规模的非结构化数据。了解更多信息，请访问：腾讯云对象存储（COS）
相关·内容
我有一个当前的脚本，显示一个200-300个文件名数组中的随机图标。这是可行的。
我对自包含的文件/应用程序有了新的兴趣。
我是否可以从css sprite表中随机选择一个精灵，并使用js或jQuery在按下按钮时显示它？
我不是在寻找完整的代码here...just，一个大概的想法将需要什么。
浏览 10提问于2019-11-20得票数 1
回答已采纳
我已经尝试运行widgy的功能，但有许多图形错误，在管理模块，页面，表单，标注等，没有什么是正常显示，因为我可以与官方网站上的演示比较。
I have followed the entire quickstart.
COMPRESS_ENABLED = True
COMPRESS_PRECOMPILERS = (
# ...
('text/x-scss', 'django_pyscss.compressor.DjangoScssFilter'),
# ...
)
Thanks for any help.
No handler
浏览 0提问于2015-01-15得票数 2
我希望两个<i>元素中的第一个元素在不盘旋时显示，而另一个元素被隐藏，而当元素悬停时，我希望相反。这是可能的CSS，还是我需要使用JS？
<a class="btn btn-like postb2" href="#">
<i class="sprite-io sprite-like-grey"></i>
<i class="sprite-io sprite-like-white"></i>
3
</a>
浏览 2提问于2013-09-20得票数 0
回答已采纳
我正在尝试设置gulp spritesmith，并得到上述错误，每次我粘贴在图标folder.Also试图让它编译通过sass.Node版本2.14.12在mac.If上有任何其他‘精灵’插件，更容易使用，请建议。
'use strict';
// Include gulp
var gulp = require('gulp');
// Include Our Plugins
var jshint = require('gulp-jshint');
var sass = require('gulp-sass');
var
浏览 4提问于2016-02-12得票数 1
1回答
我有一个任务，我需要完成之前，开始下一个吞咽的任务。这个任务创建了几个精灵。这需要一段时间，所以我需要这个任务，让它知道什么时候完成，这样下一个任务就可以开始了。这些任务在"gulpfile.js“中定义，而sprite任务称为"build-sprites.js".。
我一直在使用一个名为"run-sequence“()的gulp工具来排序这些任务。它显然需要要么返回一个流，一个承诺，或一个回调。但是，我不知道如何用这个"build-sprites.js“任务来完成这个任务。
gulpfile.js:
// Originally based off ht
浏览 1提问于2016-02-03得票数 1
2回答
我编写了以下ArrayMap：
ArrayMap<Sprite,String> arrayMap = new ArrayMap<Sprite, String>();
arrayMap.put(sprite, "Rot");
arrayMap.put(sprite1, "Braun");
arrayMap.put(sprite2, "Dunkelblau");
arrayMap.put(sprite3, "Dunkelgrün");
浏览 5提问于2017-07-28得票数 0
回答已采纳
我正在尝试编写一个像OOP javascript中的青蛙游戏。我有几个精灵可以供玩家选择。我想要实现的是，当用户选择特定的sprite时，它会在实例化player对象时更新正确的sprite。当我试图重新定义属性时，我会得到一个错误。我尝试过几种解决办法，但没有成功。我做错什么了？请帮忙！
HTML：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>First Attempt: Frogger</title>
浏览 0提问于2018-02-21得票数 0
2回答
<!-- with thanks to http://stackoverflow.com/questions/25407926/spawn-random-images-
in-canvas-in-javascript-->
<!--http://www.freesfx.co.uk/download/?type=mp3&id=11028
--audio loader--
http://stackoverflow.com/questions/18826147/javascript-audio-play-on-
click-->
<html>
<h
浏览 6提问于2014-11-26得票数 0
回答已采纳
我需要更改sprite文件编译到的目录。
我只是第一次试着把我的头绕在上。目标是将scss文件包含在我的sass目录中，然后用我的其他部分进行编译--这个部分工作得很好。但是，生成的svg目录也被放入sass目录中，因此我最终得到了：
- theme
-- sass
---- _sprites.scss
---- svg
------ sprite.css-58jkdf8js.svg
-- css
---- styles.css
当我真的需要这个的时候
- theme
-- sass
---- _sprites.scss
-- css
---- styles.css
---- svg
浏览 5提问于2015-04-24得票数 2
1回答
利用grunt模块创建svg精灵
、、、、
我对咕噜和节点js很陌生。我面临着使用grunt- svg -sprite模块创建svg精灵的问题。我使用模块来创建sprite映像。我已经使用以下命令安装了模块。
npm install grunt-svg-sprite --save-dev
我使用下面的行在我的grunt.js文件中启用了插件。
grunt.loadNpmTasks('grunt-svg-sprite');
我的插件配置如下
svg_sprite : {
basic : {
// Targ
浏览 4提问于2015-04-02得票数 3
回答已采纳
我试图将Jawr集成到我的Spring应用程序中：
<bean abstract="true" id="jawrBase" class="net.jawr.web.servlet.JawrSpringController">
<property name="configuration">
<props>
<prop key="jawr.debug.on">false</prop>
<prop k
浏览 3提问于2012-02-09得票数 2
回答已采纳
1回答
我试图在下面的链接中添加从cdn选择的jquery插件。
我正在开发一个asp.net mvc应用程序，并在布局页面中添加了如下脚本。
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/chosen/1.1.0/chosen-sprite.png"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/chose
浏览 1提问于2014-03-18得票数 4
回答已采纳
运行我的gulp任务im得到以下错误：SyntaxError: Unexpected token ; - im想知道这与我的Gulp任务有什么关系？
var gulp = require('gulp');
var sprite = require('gulp-sprite-generator');
gulp.task('sprites', function() {
var spriteOutput;
spriteOutput = gulp.src("src/css/*.css")
.pipe(s
浏览 4提问于2014-11-19得票数 0
回答已采纳
在我的gruntfile.js中，我设置了用于生成精灵的插件。我不得不说，一切都配置得很好，spritesmith是通过npm安装的，插件是package.json中的一个依赖项。但是还有别的东西阻碍了我的精灵命令的执行
sprite:{
dist: {
src: ['css/theme/images/*.jpg'],
destImg: 'css/theme/sprite/sprite.jpg',
destCSS: 'css/theme/sprite/spritejpg.css'
}
浏览 3提问于2014-01-10得票数 1
回答已采纳
1回答
在使用spritesmith处理图像时，在我的gruntfile上发现了这个奇怪的文件。有没有人经常遇到这种情况？
这是我的gruntfile文件..没有什么太大的问题，但是当涉及到精灵一代时，问题就出现了。我猜是记忆问题
module.exports = function(grunt) {
var globalConfig = { siteName: 'mysite', };
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
globalCo
浏览 1提问于2016-06-17得票数 1
2回答
嘿，伙计们，我现在正在做一个小游戏，我一直在尝试用css来水平翻转这样的图片：
JS
sprite = new Image(13, 32);
sprite.src = w1.png;// stored locally i know but i dont intend to sell this:)
if (player.velX < 0) {
sprite.setAttribute("class", "flip")
if (player.velX > 0) {
sprite.removeAttribute("class"
浏览 5提问于2016-10-25得票数 0
回答已采纳
我有一个svg2png的问题，我想把我的svg文件转换成png，它在gulp任务中说它是UnhandledPromiseRejectionWarning
var gulp = require('gulp'),
svgSprite = require('gulp-svg-sprite'),
rename = require('gulp-rename'),
del = require('del'),
svg2png = require('gulp-svg2png');
// var c
浏览 1提问于2018-03-20得票数 1
当我运行ember build时，花椰菜插件正确运行，并将sprite CSS文件和sprite PNG文件输出到资产目录中。
当我运行ember serve时，最初也会发生同样的事情。但是，当我保存任何文件，导致花椰菜重新构建它的树时，sprite CSS和PNG文件不再被合并到主应用程序树中，当页面从现场刷新页面时，页面将不再显示临时图像。
这一切为什么要发生？
如何确保每次都合并来自插件的输出？
详细信息
在询问了之后，我决定为CSS图片精灵生成编写自己的花椰菜插件：。
到目前为止我尝试过的
#1
我正在将我的插件的输出和主应用程序的输出合并到Brocfile.js中
浏览 3提问于2014-06-16得票数 0
回答已采纳
我正在用C语言写一些代码，在微处理器的LCD屏幕上随机显示精灵。目前，当我运行这段代码时，它会从上到下生成8行代码。所以它以随机的顺序打印一些东西，而不是精灵。为什么会这样呢？有人能帮帮我吗？(注意: rand是在一个单独的函数中播种的，它工作得很好，问题就在这段代码中。)
void zombies() {
Sprite zombie_sprite;
Sprite * zombie_sprite_pointer = &zombie_sprite;
byte zombie_bitmap [] = {
BYTE( 11100000 ),
BYTE(
浏览 0提问于2015-05-12得票数 0
1回答
第一次使用three.js，我做了一个非常简单的粒子动画，在其中我绘制了4种不同的纹理。到目前为止，所有的东西都是按需要工作的，除了我不知道如何旋转粒子，使它们以一个随机的方向呈现出来(颠倒，横向，等等)。任何帮助都将不胜感激！
到目前为止，您可以在这里看到我的进展：
以下是相关代码：
sprite1 = THREE.ImageUtils.loadTexture( "sprite1.png" );
sprite2 = THREE.ImageUtils.loadTexture( "sprite2.png" );
浏览 0提问于2015-07-21得票数 6
回答已采纳
1回答
SVG雪碧与Laravel混合
、、、、
我正为下面的事情而挣扎，希望能得到任何帮助.！
我尝试使用Laravel (v5.0.4)并将其与sprite ()一起扩展以生成sprite。我有以下文件夹结构：
resources/
images/
image.jpg
sass/
app.scss
svg/
file1.svg
file2.svg
webpack.sprite.js
webpack.mix.js
webpack.mix.js含量
const mix = require('laravel-mix');
require('./webpack.sprite&#
浏览 0提问于2020-06-22得票数 1
我已经为Compass雪碧公司战斗了几天。
我的网站有以下结构：
+ project
- config.rb
+ application
+ scss
- _base.scss
- main.scss
- ...
+ public (webroot)
+ js
+ css
- main.css
+ images
+ sprites
- boxarrow.pn
浏览 7提问于2014-06-05得票数 4
回答已采纳
所以我的手表出了点问题，每当我做了更改，它似乎都不能接收到更改，但一分钟后，我的控制台似乎收到了以下错误的垃圾邮件
Running "watch" task
Waiting...
Warning: EMFILE, too many open files '../..'
这是他们的垃圾邮件与以下几行。
(node) warning: Recursive process.nextTick detected. This will break in the next version of node. Please use setImmediate for recursi
浏览 0提问于2016-03-19得票数 1
1回答
大家好，stackoverflow的各位，
不久前，我为我的一个朋友做了一个网站，我为他的网站的首页编写了这个奇怪的jquery代码。简短的故事是，他一开始想要一个淡入和淡出与面板，顶部导航分开，顶部导航突出显示和面板淡入和淡出。我几乎没有时间更改HTML和图形，所以我别无选择，只能在jquery中使用每个单独的按钮进行更改。所以我的问题是......如果我有7个或更多的按钮，有没有办法合并这段代码？
谢谢你的帮助。代码在底部。
$(".block1").css({ opacity: 0.5 });
$(".home").css({ backgroundPosi
浏览 3提问于2010-11-23得票数 3
回答已采纳
1回答
我已经这样做了几个小时了，我试图让精灵在三个js中使用CSS3d渲染器显示出来，但没有效果。
这是创建精灵的代码，据说...
var sprite = document.createElement( 'img' );
this.mapCanvas = document.createElement( 'canvas' );
this.mapCanvas.width = this.hotspotWidth;
this.mapCanvas.height = this.hotspotWidth;
浏览 0提问于2013-12-11得票数 0
我想遵循这个技术，，但当我尝试使用gulp精灵时，我在Win 7的安装上遇到了问题。
“但是我得到了events.js:72 thro；// UInhandled错误事件。ArgumentError: SVGSpriter.compile："{}”不是有效的模式配置。“
我想我应该把下面这些行换成guess雪碧。有人能告诉我该换什么吗？
return gulp.src(paths.sprite.src)
.pipe(svgo())
.pipe(svgSprites({
cssFile: paths.sprite.css,
previe
浏览 3提问于2015-03-01得票数 0
当我做一个git状态，我得到下面的图像文件是改变的。但是它唯一的图像文件，不应该在文件中有任何LF/CRLF，
$ git status
# HEAD detached at origin/master
# Changes not staged for commit:
# (use "git add <file>..." to update what will be committed)
# (use "git checkout -- <file>..." to discard changes in working directo
浏览 12提问于2021-11-26得票数 1
回答已采纳
1回答
我想计算一下丢失的精灵。
例如：-随机生成的精灵显示在屏幕上。我想射出精灵。如果被射杀意味着精灵消失了。如果我错过了一个精灵。未命中的精灵计数超过10表示“游戏结束”。
这是我拍摄精灵的代码：
- (void)update:(ccTime)dt {
NSMutableArray *targetsToDelete = [[NSMutableArray alloc] init];
for (_sprite in _targets) {
CGRect spriteRect = CGRectMake(
_sp
浏览 0提问于2011-02-16得票数 0
回答已采纳
1回答
我已经看到这个问题在这里被问了很多次了，但是没有任何回复帮助我解决这个问题:我试图用console.log().引擎加载雪碧，但是它没有出现，尽管它已经被识别出来，而且在使用PixiJS时也很不稳定。我做错了什么？
我遵循了这个URL中的教程：
我的代码如下：
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=
浏览 0提问于2017-01-05得票数 1
回答已采纳
2回答
我想要显示4个随机图像，其中一个图像是正确的图像。所以我从"correct_caps“文件夹中随机选取了一张图片，从另一个文件夹中随机选取了3张。现在，我希望选择随机图像变量来显示这些图像，以便正确的图像始终改变其位置。
using UnityEngine;
using UnityEngine.SceneManagement;
using UnityEngine.UI;
using UnityEngine.EventSystems;
public class NewBehaviourScript : MonoBehaviour
{
public Image art1
浏览 0提问于2016-04-12得票数 2
我只是复制粘贴了开始的任务：
var gulp = require('gulp');
var spritesmith = require('gulp.spritesmith');
gulp.task('sprite', function () {
console.log("inside sprite");
var spriteData = gulp.src('/assets/images/*.jpg').pipe(spritesmith({
imgName: 'sprite
浏览 2提问于2016-04-25得票数 0
回答已采纳
它可以在开发模式下找到，但在生产模式中显示了ActionController::RoutingError (No route matches [GET] "/lenord-single-page-theme/js/custom.js"):错误。
在运行rails服务器之前，我运行了RAILS_ENV=production rake assets:precompile --trace
我在供应商下添加了两个资产文件夹
在application.rb文件中，我插入了这一行
config.assets.paths << "#{Rails.root}/vendor/
浏览 2提问于2014-05-20得票数 4
在这里，我试图迁移我的现有网站，即使用gulp 3。现在升级gulp从3到4。
下面是Gulpfile.js
'use strict';
var gulp = require('gulp'),
autoprefixer = require('gulp-autoprefixer'),
sass = require('gulp-sass'),
sourcemaps = require('gulp-sourcemaps'),
scsslint = require('gulp-scss-lint&
浏览 3提问于2022-01-28得票数 0
回答已采纳
看看现在正在显示的Google主页。下面提供了一个屏幕截图。
Google使用的不是一个单独的图片，而是css sprite。精灵图像
提供如下(尺寸已更改)：
问题是为什么使用css sprite而不是单个图像？如果使用的是单个图像，那么HTTP请求的数量不会与这个css sprite案例中的相同吗？
浏览 0提问于2013-03-11得票数 2
回答已采纳
我试图运行任务‘图标’，这将在同一时间运行两个不同的任务，但当我尝试运行它时，我会得到错误信息。我尝试过许多不同的事情，但都没有成功，所以如果有人知道如何解决，请告诉我:)
我将在下面发布我的代码：
const gulp = require('gulp');
const svgSprite = require('gulp-svg-sprite');
const rename = require('gulp-rename');
const config = {
mode: {
css: {
render: {
浏览 1提问于2021-03-15得票数 1
2回答
我正在使用ReactJs。我想要动态更改图像的位置。
我正在尝试设置风格，就像描述的：
我的sprite.js：
'use strict';
import '../res/my_css.css'
const React = require('react');
const ReactDOM = require('react-dom');
class Sprite extends React.Component {
render() {
var left = 5000 + 'px';
var t
浏览 0提问于2018-03-12得票数 6
回答已采纳
1回答
如何更新具有随机数的变量。我在用three.js。这是我的密码。当它第一次工作时，它被称为将一个精灵生成到一个随机的位置，但随后它就一直返回到相同的位置。我认为，在使用变量之前调用它们，我会更新它们，但它不起作用。
var locX = Math.floor((Math.random()*450)+1);
locX *= Math.floor(Math.random()*2) == 1 ? 1 : -1;
var locY = Math.floor((Math.random()*250)+1);
locY *= Math.floo
浏览 1提问于2013-09-26得票数 0
回答已采纳
我正在使用统一编程一个简单的机器人游戏在C#。现在，游戏所做的就是在启动时随机加载196个标志中的一个(查看：https://hastebin.com/suxonayoce.cs或下面的代码)。这个类文件是目前唯一的类文件。当我在“团结”中玩游戏时，一切都如预期的那样工作(即每次游戏启动时都会显示一个随机标志)。然而，当我在我的Android手机上构建和运行游戏时，只会显示占位符标志，而不是随机选择的。
到目前为止，我已经尝试重新启动团结，重新导入所有资产，并在一个新的项目中重新创建游戏。这些都解决不了这个问题。
using System.IO;
using UnityEngine;
usin
浏览 0提问于2018-06-10得票数 2
我正在尝试在我的CSS应用程序中使用CSS Sprites。这是我的网页布局：
<div id="container">
<div id="header" /> <!-- part of CSS sprite --><br />
<div id="content" /> <!-- repeats vertically, separate image --> <br />
<div id="separator"> <!-
浏览 0提问于2010-06-04得票数 1
回答已采纳
截图：
文件"Gruntfile.js“的一部分
sprite: {
mixins: {
src: ['layout/media/images/sprite/*.png'],
destImg: 'layout/media/images/sprite.png',
destCSS: 'layout/assets/css/variables/sprite-mixins.styl',
algorithm: 'binary-tree',
pa
浏览 1提问于2014-07-31得票数 1
我使用优秀的 svg - sprite 作为cli，从其他几个svg文件中生成svg sprite。大多数配置都是可以理解的，我得到了svg文件和预期的相关css。我希望生成的svg文件始终具有相同的名称，而不是一个看起来具有短随机字符串的名称，但我无法对其进行配置。有什么建议吗？
Github存储库：
配置工具：
浏览 1提问于2017-02-17得票数 0
回答已采纳
1回答
当我运行npm运行时，"build": "webpack" webpack用main.css、index.html和index.js为我生成dist文件夹，但是来自CSS或HTML的图像不起作用，而且它们不在那里。
在dist文件夹中的CSS中，它们被引用如下
background-image: url("../../../assets/img/works/works-3.jpg");
在HTML中
<img src="./assets/img/logo.png">
我不知道该修复什么，所以我的图像是有效的。
我有这个
浏览 0提问于2018-10-28得票数 1
回答已采纳
2回答
在html5 (使用js和css3)中，有没有可能让Sprite/Character悬停在页面的底部角落(就像Office中的Microsoft Clippy一样)，并让它显示内容？
我所说的东西是指动态加载少量的文本气泡。
浏览 0提问于2011-09-19得票数 1
回答已采纳
我有一个网站设置，它可以在我的工作笔记本电脑上工作，办公室里所有的Windows机器都可以工作，但当我在我的个人电脑上运行'grunt‘时，它不能工作。我经常在我的个人电脑上使用browserSync，我仔细检查了另一个网站，它正常地加载了，但由于某些原因，它在这个网站上不起作用。我已经尝试了所有的方法，从并排比较文件，手动将整个文件夹从我的工作机器复制到我的个人机器，甚至复制了node_modules以防发生什么事情。
这是在我的package.json文件中："grunt-browser-sync": "^2.1.3",
步骤
1-运行grunt 2
浏览 15提问于2018-01-12得票数 0
我已经设置了以下加载，但现在我有第二个背景图像，我喜欢随机显示。如何将背景随机地更改为background2呢？
以下是我所拥有的：
static_background_building = new Sprite(BitmapFactory.decodeResource(getResources(), R.drawable.background), ScreenWidth());
static_background_building = new Sprite(BitmapFactory.decodeResource(getResources(), R.drawable.background2
浏览 2提问于2015-04-25得票数 1
回答已采纳
1回答
解决HTML画布图像渲染降级问题
、、、、
这些天，当我试图用画布在HTML页面中呈现一些图形时，我要解决以下问题:经过一段时间后，画布元素正在降级我的图像。
下面是可视化的问题：
图像渲染(32x32)
初审呈现(使用浏览器缩放)
图像是如何在移动后(通过键盘事件)获得的，随机
注1:我没有调整图像的大小！注2:负责绘图的函数每10毫秒调用一次--注3:我在CSS 4中对画布使用image-rendering: pixelated：下面是负责绘制它的函数：
function draw_player(x,y,w,h,state){
if(state>2){ctx.drawImage(
浏览 2提问于2020-11-05得票数 1
回答已采纳
我想要一个单独的php页面。如果我将链接放置在主页上，应该是该页面的锚点吗？假设我的页面名是projects.php，但是当我像这样将它放入锚标记时，它不会转到那个页面。
为了正确工作，我猜在"projects.php“之前一定有一些wordpress函数。
这是我的主题的层次：
myTheme
│ .jscsrc
│ .jshintignore
│ 404.php
│ archive.php
│ comments.php
│ footer.php
│ frontpage.php
│ functions.php
│ header.php
│ i
浏览 0提问于2016-03-05得票数 0
回答已采纳
1回答
守望者没有看到新文件
、、、
我把Gruntfile.js做成这样：
'use strict';
module.exports = function (grunt) {
grunt.loadNpmTasks('grunt-favicons');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-bake');
grunt.loadNpmTasks('grunt-contrib-htmlmin');
grunt.loadNpmTasks('gr
浏览 1提问于2015-07-28得票数 6
回答已采纳
当我深入到繁琐的任务时，我有一些关于连接/压缩/压缩JavaScript和CSS文件的问题。JavaScript对我来说不是大问题，但CSS才是大问题。
考虑如下的文件结构：
-resources
-- js
-- css
-- vendor
--- jquery
- jquery.min.js
--- fancybox
- fancybox.min.js
- fancybox.min.css
- sprite.png
--- bootstrap
- bootstrap.min.js
- bootstrap.min.css
我想要将供应商文件夹中
浏览 0提问于2014-09-02得票数 1
我已经把我的gulpfile.js升级到了GUGP4，gulp dev运行得很好。但是，每当我编辑任何文件时，reload和inject任务都会进入一个无穷无尽的循环。 我的gulpfile.js： var gulp = require('gulp'),
sass = require('gulp-sass'),
symlink = require('gulp-symlink'),
jshint = require('gulp-jshint'),
browserSync = require('browser
浏览 21提问于2019-01-13得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
