- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我一直在帮助我的 friend 创建个人网站,我发现了这个 awesome jssor template用于图像幻灯片。它有三个版本deeply minified
、without jquery
和with jquery
。
我没有使用 jQuery 的经验,所以我决定使用没有 jQuery 的版本,我花了很多时间试图理解代码中实际发生的事情。然后我转向了深度缩小的版本,这非常简洁,因为一切都在没有对 css 或 js 文件的单一引用的情况下工作。
现在,在深度缩小
版本中,样式和脚本都写在一行中。我不打算将它们包含在帖子中,因为它们超过 30000 个字符,但所有文件都可以在上面提到的模板链接中找到。
我用过这个css unminifier - 还有这个 js unminifier - 以某种方式将它们转换成可读和可理解的格式。之后,我相应地创建了样式和 js
文件,并将未缩小的代码粘贴到那里。我已将文件的引用和路径添加到 html
的头部,但由于某种原因没有任何效果。
...
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="css/text" href="style/slidestyle.css">
<script src="js/script.js"></script>
<title></title>
</head>
...
您可能会问:“如果无需任何更改就可以正常工作,为什么我需要更改任何内容?”。没错,但在那种情况下,我不知道它是如何工作的,希望你同意我的看法,这很糟糕。
我的问题和询问是,如何正确地取消压缩 css 和 js 文件以及在 html 中引用它们的后记?我认为以这种方式做事不是一种常见的做法,但我希望能够理解事物的工作原理并在需要时进行更改。
更新:我想通了并提交给 GitHub .它适用于遇到类似问题或想更好地了解 slider 工作原理的任何人。
最佳答案
How to correctly unminify js and css
长话短说:你不知道;至少对于 JS 不是。
在 CSS 中,我知道的 minifyer 只去除空格、注释和尾随 ;
等等;转换 #FF0000 -> 红色之类的东西。一切仍然非常可读,所以添加一些换行符和空格会使代码看起来更容易。
在 JS 中,只有不必要的空格被删除,但所有局部变量和函数名都被(通常)单字符名称替换。通常在不同的上下文中对不同的事物使用相同的名称。更激进的压缩器甚至可以将您的代码结构更改为更短的内容。
几乎我们对代码的所有理解都是基于使用的名称和代码的结构;所以问题。
您可以尝试从缩小的代码中进行逆向工程,或者有时您必须在其他人的代码中修补某些内容,但除非您真的需要并且别无选择,否则您不会取消缩小代码。
Then I have moved to deeply minified version, what is pretty neat as everything works without a single reference to css or js files
不,不是,这是最后的选择解决方案,如果其他任何方法都失败的话。就像在您根本无法引用其他文件的环境中一样。
因为这 30kb 的 CSS-String 现在不能被浏览器缓存(如果你使用一个单独的文件,它们就会缓存),而且在最坏的情况下,你在一个页面上添加这个 block 不止一次,所以它只会使您的 HTML 膨胀并降低您的页面速度。
You probably ask: "Why do I need to change anything if it works without any cahnges?". That's true, but in that case I've no idea how it's working and hope you agree with me that it's bad.
如果您想了解它的工作原理,请查看 jQuery 版本。由于 jQuery 是一个外部库,缩小器无法去除使用的方法名称。第二,代码更密集,因为您不必通读管理动画的代码,您只需阅读一个调用,将这些对象上的这些属性设置为这些值,等等。这可以让您在没有实现细节的情况下更好地理解这段代码中发生的事情。
关于javascript - 如何正确unminify js和css,并在html5中引用它们?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35682684/
我正在学习构建单页应用程序 (SPA) 所需的所有技术。总而言之,我想将我的应用程序实现为单独的层,其中前端仅使用 API Web 服务(json 通过 socket.io)与后端通信。前端基本上是
当我看到存储在我的数据库中的日期时。 这是 正常 。日期和时间就是这样。 但是当我运行 get 请求来获取数据时。 此格式与存储在数据库 中的格式不同。为什么会发生这种情况? 最佳答案 我认为您可以将
就目前而言,这个问题不适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visit the
我正在尝试使用backbone.js 实现一些代码 和 hogan.js (http://twitter.github.com/hogan.js/) Hogan.js was developed ag
我正在使用 Backbone.js、Node.js 和 Express.js 制作一个 Web 应用程序,并且想要添加用户功能(登录、注销、配置文件、显示内容与该用户相关)。我打算使用 Passpor
关闭。这个问题需要多问focused 。目前不接受答案。 想要改进此问题吗?更新问题,使其仅关注一个问题 editing this post . 已关闭 8 年前。 Improve this ques
我尝试在 NodeJS 中加载数据,然后将其传递给 ExpressJS 以在浏览器中呈现 d3 图表。 我知道我可以通过这种方式加载数据 - https://github.com/mbostock/q
在 node.js 中,我似乎遇到了相同的 3 个文件名来描述应用程序的主要入口点: 使用 express-generator 包时,会创建一个 app.js 文件作为生成应用的主要入口点。 通过 n
最近,我有机会观看了 john papa 关于构建单页应用程序的精彩类(class)。我会喜欢的。它涉及服务器端和客户端应用程序的方方面面。 我更喜欢客户端。在他的实现过程中,papa先生在客户端有类
就目前而言,这个问题不适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visit the
我是一个图形新手,需要帮助了解各种 javascript 2D 库的功能。 . . 我从 Pixi.js 中得到了什么,而我没有从 Konva 等基于 Canvas 的库中得到什么? 我从 Konva
我正在尝试将一些 LESS 代码(通过 ember-cli-less)构建到 CSS 文件中。 1) https://almsaeedstudio.com/ AdminLTE LESS 文件2) Bo
尝试查看 Express Passport 中所有登录用户的所有 session ,并希望能够查看当前登录的用户。最好和最快的方法是什么? 我在想也许我可以在登录时执行此操作并将用户模型数据库“在线”
我有一个 React 应用程序,但我需要在组件加载完成后运行一些客户端 js。一旦渲染函数完成并加载,运行与 DOM 交互的 js 的最佳方式是什么,例如 $('div').mixItUp() 。对
请告诉我如何使用bodyparser.raw()将文件上传到express.js服务器 客户端 // ... onFilePicked(file) { const url = 'upload/a
我正在尝试从 Grunt 迁移到 Gulp。这个项目在 Grunt 下运行得很好,所以我一定是在 Gulp 中做错了什么。 除脚本外,所有其他任务均有效。我现在厌倦了添加和注释部分。 我不断收到与意外
我正在尝试更改我的网站名称。找不到可以设置标题或应用程序名称的位置。 最佳答案 您可以在 config/ 目录中创建任何文件,例如 config/app.js 包含如下内容: module.expor
经过多年的服务器端 PHP/MySQL 开发,我正在尝试探索用于构建现代 Web 应用程序的新技术。 我正在尝试对所有 JavaScript 内容进行排序,如果我理解得很好,一个有效的解决方案可以是服
我是 Nodejs 的新手。我在 route 目录中有一个 app.js 和一个 index.js。我有一个 app.use(multer....)。我还定义了 app.post('filter-re
我正在使用 angular-seed用于构建我的应用程序的模板。最初,我将所有 JavaScript 代码放入一个文件 main.js。该文件包含我的模块声明、 Controller 、指令、过滤器和
我是一名优秀的程序员,十分优秀!