所以我正在使用
PHP框架CodeIgniter(
http://ellislab.com/codeigniter)的一个项目,在它的内部,我们正在使用很多不同的CSS / JS文件,在我们的标题包中被调用.
我在wordpress网站和其他项目之前使用了Minify工具,并在GitHub(https://github.com/ericbarnes/ci-minify)上的CodeIgniter库中运行,并且认为我会在我的项目中使用它.
它工作得很好,而且很花哨,但不幸的是,我压缩了很多CSS和JS文件,在页面加载的时候,如果我没有使用它,它会更快.
以下是我的控制器中的代码：
// minify css
$cssfiles = array('assets/css/normalize.css','assets/css/hook-new.css','assets/css/hook.css','assets/css/components.css','assets/css/rtl.css','assets/css/global.css','assets/css/body.css','assets/css/mediaqueries.css','assets/select2-3.4.3/select2.css','assets/jquery_bootstrap/css/custom-theme/jquery-ui-1.9.2.custom.css');
$cssfile = $this->minify->combine_files($cssfiles);
$csscontents = $this->minify->css->min($cssfile);
$this->minify->save_file($csscontents,'assets/css/all.css');
// minify js
$jsfiles = array('assets/js/application/js_config.js','assets/js/bootstrap.min.js','assets/js/custom.js','assets/select2-3.4.3/select2.js','assets/js/startup.js','assets/ckeditor/ckeditor.js','assets/js/jquery.validationEngine-en.js','assets/js/jquery.validationEngine.js','assets/js/scripts.js','assets/js/application/js_timer.js');
$jsfile = $this->minify->combine_files($jsfiles);
$jscontents = $this->minify->js->min($jsfile);
$this->minify->save_file($jscontents,'assets/js/all.js');
所以我正在拿这些大型的CSS和JS文件,压缩它们,然后将它们保存到一个大文件中.但是,有没有更好和更有效的方法呢？
我知道我可以手工结合,但是当我在处理事情时,我有大量的文件可以筛选.不仅如此,但是我喜欢Minify能够摆脱不必要的空白并且真正地缩小代码的能力.
所以有什么想法如何有效地完成这个？
谢谢！
解决方法
为什么不使用
Grunt？您可以设置几个任务来连接和缩小JavaScript文件.我自己做了一个CodeIgniter项目,它运行良好.
Here’s a tutorial.
Grunt是一个基于Node.js的工具,但是由于您将在开发机器上进行构建,因此不应该是一个问题 – 您不需要在服务器上安装Node.这个想法是,在提交更改之前,您运行构建任务,连接和缩小您的JavaScript和CSS.然后,您的提交包括最小化的文件,并将其推送到服务器.
这是我用于我的CodeIgniter项目的Gruntfile：
module.exports = function(grunt) {
grunt.initConfig({
concat: {
dist: {
src: ['static/bower_components/skeleton/stylesheets/*.css','static/css/style.css'],dest: 'static/css/main.css'
}
},uglify: {
dist: {
src: 'static/js/main.js',dest: 'static/js/main.min.js'
}
},cssmin: {
dist: {
src: 'static/css/main.css',dest: 'static/css/main.min.css'
}
}
});
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.registerTask('build',['concat','uglify','cssmin']);
};
和package.json文件：
{
"name": "blah","version": "0.0.1","description": "A project","devDependencies": {
"grunt": "~0.4.0","grunt-contrib-concat": "~0.3.0","grunt-contrib-copy": "~0.4.1","grunt-contrib-sass": "~0.5.0","grunt-contrib-compass": "~0.6.0","grunt-contrib-clean": "~0.5.0","grunt-contrib-htmlmin": "~0.1.3","grunt-contrib-cssmin": "~0.6.2","grunt-contrib-coffee": "~0.7.0","grunt-contrib-jst": "~0.5.1","grunt-contrib-jshint": "~0.6.4","grunt-contrib-uglify": "~0.2.4","grunt-contrib-requirejs": "~0.4.1","grunt-contrib-connect": "~0.5.0","grunt-contrib-watch": "~0.5.3","grunt-contrib-csslint": "~0.1.2","grunt-contrib-compress": "~0.5.2","grunt-contrib-handlebars": "~0.5.11","grunt-contrib-jade": "~0.8.0","grunt-contrib-stylus": "~0.8.0","grunt-contrib-jasmine": "~0.5.2","grunt-contrib-qunit": "~0.3.0","grunt-contrib-imagemin": "~0.3.0","grunt-contrib-less": "~0.7.0","grunt-contrib-nodeunit": "~0.2.1","grunt-contrib-yuidoc": "~0.5.0","grunt-contrib": "~0.8.0"
},"author": "My Name","license": "licensename"
}
