1. Zuhause
  2. Frage und Antwort
  3. Grunt php und css generation

Grunt php und css generation

2013-10-14 11 views
5

Ich benutze yeoman, ich habe grunt-php installiert und ich kann PHP-Datei laden, aber die CSS-Datei wird nicht zugegriffen. Scheint, dass der scss nicht erfüllt ist oder der Pfad in meiner index.php nicht auf die tmp CSS-Datei zeigt.Grunt php und css generation

Ich habe verschiedene Probleme ausprobiert (Pfade ändern), aber ich kann es nicht beheben.

Hier ist meine index.php Header:

<head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <title>wine trip yo</title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width"> 
    <!-- Place favicon.ico and apple-touch-icon.png in the root directory --> 
    <!-- build:css(.tmp) styles/main.css --> 
    <link rel="stylesheet" href="styles/main.css"> 
    <!-- endbuild --> 
    <!-- build:js scripts/vendor/modernizr.js --> 
    <script src="bower_components/modernizr/modernizr.js"></script> 
    <!-- endbuild --> 
</head>

Und hier ist mein Gruntfile:

// Generated on 2013-10-14 using generator-webapp 0.4.3 
'use strict'; 

// # Globbing 
// for performance reasons we're only matching one level down: 
// 'test/spec/{,*/}*.js' 
// use this if you want to recursively match all subfolders: 
// 'test/spec/**/*.js' 

module.exports = function (grunt) { 
// show elapsed time at the end 
require('time-grunt')(grunt); 
// load all grunt tasks 
require('load-grunt-tasks')(grunt); 

grunt.loadNpmTasks('grunt-php'); 

grunt.initConfig({ 
    // configurable paths 
    yeoman: { 
     app: 'app', 
     dist: 'dist' 
    }, 
    watch: { 
     compass: { 
      files: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'], 
      tasks: ['compass:server', 'autoprefixer'] 
     }, 
     styles: { 
      files: ['<%= yeoman.app %>/styles/{,*/}*.css'], 
      tasks: ['copy:styles', 'autoprefixer'] 
     }, 
     livereload: { 
      options: { 
       livereload: '<%= connect.options.livereload %>' 
      }, 
      files: [ 
       '<%= yeoman.app %>/*.php', 
       '.tmp/styles/{,*/}*.css', 
       '{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js', 
       '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}' 
      ] 
     } 
    }, 
    connect: { 
     options: { 
      port: 9000, 
      livereload: 35729, 
      // change this to '0.0.0.0' to access the server from outside 
      hostname: 'localhost' 
     }, 
     livereload: { 
      options: { 
       open: true, 
       base: [ 
        '.tmp', 
        '<%= yeoman.app %>' 
       ] 
      } 
     }, 
     test: { 
      options: { 
       base: [ 
        '.tmp', 
        'test', 
        '<%= yeoman.app %>' 
       ] 
      } 
     }, 
     dist: { 
      options: { 
       open: true, 
       base: '<%= yeoman.dist %>' 
      } 
     } 
    }, 
    clean: { 
     dist: { 
      files: [{ 
       dot: true, 
       src: [ 
        '.tmp', 
        '<%= yeoman.dist %>/*', 
        '!<%= yeoman.dist %>/.git*' 
       ] 
      }] 
     }, 
     server: '.tmp' 
    }, 
    jshint: { 
     options: { 
      jshintrc: '.jshintrc' 
     }, 
     all: [ 
      'Gruntfile.js', 
      '<%= yeoman.app %>/scripts/{,*/}*.js', 
      '!<%= yeoman.app %>/scripts/vendor/*', 
      'test/spec/{,*/}*.js' 
     ] 
    }, 
    mocha: { 
     all: { 
      options: { 
       run: true, 
       urls: ['http://<%= connect.test.options.hostname %>:<%= connect.test.options.port %>/index.php'] 
      } 
     } 
    }, 
    compass: { 
     options: { 
      sassDir: '<%= yeoman.app %>/styles', 
      cssDir: '.tmp/styles', 
      generatedImagesDir: '.tmp/images/generated', 
      imagesDir: '<%= yeoman.app %>/images', 
      javascriptsDir: '<%= yeoman.app %>/scripts', 
      fontsDir: '<%= yeoman.app %>/styles/fonts', 
      importPath: '<%= yeoman.app %>/bower_components', 
      httpImagesPath: '/images', 
      httpGeneratedImagesPath: '/images/generated', 
      httpFontsPath: '/styles/fonts', 
      relativeAssets: false, 
      assetCacheBuster: false 
     }, 
     dist: { 
      options: { 
       generatedImagesDir: '<%= yeoman.dist %>/images/generated' 
      } 
     }, 
     server: { 
      options: { 
       debugInfo: true 
      } 
     } 
    }, 
    autoprefixer: { 
     options: { 
      browsers: ['last 1 version'] 
     }, 
     dist: { 
      files: [{ 
       expand: true, 
       cwd: '.tmp/styles/', 
       src: '{,*/}*.css', 
       dest: '.tmp/styles/' 
      }] 
     } 
    }, 
    // not used since Uglify task does concat, 
    // but still available if needed 
    /*concat: { 
     dist: {} 
    },*/ 
    requirejs: { 
     dist: { 
      // Options: https://github.com/jrburke/r.js/blob/master/build/example.build.js 
      options: { 
       // `name` and `out` is set by grunt-usemin 
       baseUrl: '<%= yeoman.app %>/scripts', 
       optimize: 'none', 
       // TODO: Figure out how to make sourcemaps work with grunt-usemin 
       // https://github.com/yeoman/grunt-usemin/issues/30 
       //generateSourceMaps: true, 
       // required to support SourceMaps 
       // http://requirejs.org/docs/errors.html#sourcemapcomments 
       preserveLicenseComments: false, 
       useStrict: true, 
       wrap: true 
       //uglify2: {} // https://github.com/mishoo/UglifyJS2 
      } 
     } 
    }, 
    rev: { 
     dist: { 
      files: { 
       src: [ 
        '<%= yeoman.dist %>/scripts/{,*/}*.js', 
        '<%= yeoman.dist %>/styles/{,*/}*.css', 
        '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp}', 
        '<%= yeoman.dist %>/styles/fonts/{,*/}*.*' 
       ] 
      } 
     } 
    }, 
    useminPrepare: { 
     options: { 
      dest: '<%= yeoman.dist %>' 
     }, 
     html: '<%= yeoman.app %>/index.php' 
    }, 
    usemin: { 
     options: { 
      dirs: ['<%= yeoman.dist %>'] 
     }, 
     html: ['<%= yeoman.dist %>/{,*/}*.php'], 
     css: ['<%= yeoman.dist %>/styles/{,*/}*.css'] 
    }, 
    imagemin: { 
     dist: { 
      files: [{ 
       expand: true, 
       cwd: '<%= yeoman.app %>/images', 
       src: '{,*/}*.{png,jpg,jpeg}', 
       dest: '<%= yeoman.dist %>/images' 
      }] 
     } 
    }, 
    svgmin: { 
     dist: { 
      files: [{ 
       expand: true, 
       cwd: '<%= yeoman.app %>/images', 
       src: '{,*/}*.svg', 
       dest: '<%= yeoman.dist %>/images' 
      }] 
     } 
    }, 
    cssmin: { 
     // This task is pre-configured if you do not wish to use Usemin 
     // blocks for your CSS. By default, the Usemin block from your 
     // `index.php` will take care of minification, e.g. 
     // 
     //  <!-- build:css({.tmp,app}) styles/main.css --> 
     // 
     // dist: { 
     //  files: { 
     //   '<%= yeoman.dist %>/styles/main.css': [ 
     //    '.tmp/styles/{,*/}*.css', 
     //    '<%= yeoman.app %>/styles/{,*/}*.css' 
     //   ] 
     //  } 
     // } 
    }, 
    htmlmin: { 
     dist: { 
      options: { 
       /*removeCommentsFromCDATA: true, 
       // https://github.com/yeoman/grunt-usemin/issues/44 
       //collapseWhitespace: true, 
       collapseBooleanAttributes: true, 
       removeAttributeQuotes: true, 
       removeRedundantAttributes: true, 
       useShortDoctype: true, 
       removeEmptyAttributes: true, 
       removeOptionalTags: true*/ 
      }, 
      files: [{ 
       expand: true, 
       cwd: '<%= yeoman.app %>', 
       src: '*.php', 
       dest: '<%= yeoman.dist %>' 
      }] 
     } 
    }, 
    // Put files not handled in other tasks here 
    copy: { 
     dist: { 
      files: [{ 
       expand: true, 
       dot: true, 
       cwd: '<%= yeoman.app %>', 
       dest: '<%= yeoman.dist %>', 
       src: [ 
        '*.{ico,png,txt}', 
        '.htaccess', 
        'images/{,*/}*.{webp,gif}', 
        'styles/fonts/{,*/}*.*', 
        'bower_components/sass-bootstrap/fonts/*.*' 
       ] 
      }] 
     }, 
     styles: { 
      expand: true, 
      dot: true, 
      cwd: '<%= yeoman.app %>/styles', 
      dest: '.tmp/styles/', 
      src: '{,*/}*.css' 
     } 
    }, 
    modernizr: { 
     devFile: '<%= yeoman.app %>/bower_components/modernizr/modernizr.js', 
     outputFile: '<%= yeoman.dist %>/bower_components/modernizr/modernizr.js', 
     files: [ 
      '<%= yeoman.dist %>/scripts/{,*/}*.js', 
      '<%= yeoman.dist %>/styles/{,*/}*.css', 
      '!<%= yeoman.dist %>/scripts/vendor/*' 
     ], 
     uglify: true 
    }, 
    concurrent: { 
     server: [ 
      'compass', 
      'copy:styles' 
     ], 
     test: [ 
      'copy:styles' 
     ], 
     dist: [ 
      'compass', 
      'copy:styles', 
      'imagemin', 
      'svgmin', 
      'htmlmin' 
     ] 
    }, 
    bower: { 
     options: { 
      exclude: ['modernizr'] 
     }, 
     all: { 
      rjsConfig: '<%= yeoman.app %>/scripts/main.js' 
     } 
    }, 
    php: { 
     watch: {}, 
     options: { 
      keepalive: true, 
      open: true, 
      base: 'app' 
     } 
    } 
}); 

grunt.registerTask('server', function (target) { 
    if (target === 'dist') { 
     return grunt.task.run(['build', 'connect:dist:keepalive']); 
    } 

    grunt.task.run([ 
     'clean:server', 
     'concurrent:server', 
     'autoprefixer', 
     'connect:livereload', 
     'watch' 
    ]); 
}); 

grunt.registerTask('test', [ 
    'clean:server', 
    'concurrent:test', 
    'autoprefixer', 
    'connect:test', 
    'mocha' 
]); 

grunt.registerTask('build', [ 
    'clean:dist', 
    'useminPrepare', 
    'concurrent:dist', 
    'autoprefixer', 
    'requirejs', 
    'concat', 
    'cssmin', 
    'uglify', 
    'modernizr', 
    'copy:dist', 
    'rev', 
    'usemin' 
]); 

grunt.registerTask('default', [ 
    'jshint', 
    'test', 
    'build' 
]); 


//grunt.registerTask('test', ['php', 'mocha']); 
grunt.registerTask('phpwatch', [ 
    'clean:server', 
    'concurrent:server', 
    'autoprefixer', 
    'connect:livereload', 
    'php:watch', 
    'watch' 
]);

};

Ich lauching Server mit dem folgenden Befehl:

grunt phpwatch

der Ausgang wieder, dass alle Dateien außer gefunden werden: rät

127.0.0.1:37659 [404]: /styles/main.css - No such file or directory

Jeder, wie meine gruntfile, um benutzerdefinierte CSS-Datei zu machen zugänglich wäre sehr nett. Vielen Dank.

LETZTE VERSION (2013.02.12):

PS: Ich habe derzeit einen Fehler in dem Namen in requireJS Variable Generation/heraus so harcoded ich es aber die SCSS Datei Generation Werke:

// Generated on 2013-10-14 using generator-webapp 0.4.3 
'use strict'; 


module.exports = function (grunt) { 
// show elapsed time at the end 
require('time-grunt')(grunt); 
// load all grunt tasks 
require('load-grunt-tasks')(grunt); 

grunt.loadNpmTasks('grunt-php'); 
grunt.loadNpmTasks('grunt-bower-requirejs'); 
//grunt.loadNpmTasks('grunt-ftpush'); 

grunt.initConfig({ 
    // configurable paths 
    yeoman: { 
     app: 'app', 
     dist: 'dist' 
    }, 
    watch: { 
     compass: { 
      files: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'], 
      tasks: ['compass:server', 'autoprefixer'] 
     }, 
     styles: { 
      files: ['<%= yeoman.app %>/styles/{,*/}*.css'], 
      tasks: ['copy:styles', 'autoprefixer'] 
     }, 
     livereload: { 
      options: { 
       livereload: '<%= connect.options.livereload %>' 
      }, 
      files: [ 
       '<%= yeoman.app %>/*.php', 
       '.tmp/styles/{,*/}*.css', 
       '{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js', 
       '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}' 
      ] 
     } 
    }, 
    connect: { 
     options: { 
      port: 9000, 
      livereload: 35729, 
      // change this to '0.0.0.0' to access the server from outside 
      //hostname: 'localhost' 
      hostname: 'wine-trip.net' 
     }, 
     livereload: { 
      options: { 
       open: true, 
       base: [ 
        '.tmp', 
        '<%= yeoman.app %>' 
       ] 
      } 
     }, 
     test: { 
      options: { 
       base: [ 
        '.tmp', 
        'test', 
        '<%= yeoman.app %>' 
       ] 
      } 
     }, 
     dist: { 
      options: { 
       open: true, 
       base: '<%= yeoman.dist %>' 
      } 
     } 
    }, 
    clean: { 
     dist: { 
      files: [{ 
       dot: true, 
       src: [ 
        '.tmp', 
        '<%= yeoman.dist %>/*', 
        '!<%= yeoman.dist %>/.git*' 
       ] 
      }] 
     }, 
     server: '.tmp' 
    }, 
    jshint: { 
     options: { 
      jshintrc: '.jshintrc', 
      indent: 5 
     }, 
     all: [ 
      'Gruntfile.js', 
      '<%= yeoman.app %>/scripts/{,*/}*.js', 
      '!<%= yeoman.app %>/scripts/vendor/*', 
      'test/spec/{,*/}*.js' 
     ] 
    }, 
    mocha: { 
     all: { 
      options: { 
       run: true, 
       urls: ['http://<%= connect.test.options.hostname %>:<%= connect.test.options.port %>/index.php'] 
      } 
     } 
    }, 
    compass: { 
     options: { 
      sassDir: '<%= yeoman.app %>/styles', 
      cssDir: '.tmp/styles', 
      //cssDir: '<%= yeoman.app %>/styles', 
      generatedImagesDir: '.tmp/images/generated', 
      imagesDir: '<%= yeoman.app %>/images', 
      javascriptsDir: '<%= yeoman.app %>/scripts', 
      fontsDir: '<%= yeoman.app %>/styles/fonts', 
      importPath: '<%= yeoman.app %>/bower_components', 
      httpImagesPath: '/images', 
      httpGeneratedImagesPath: '/images/generated', 
      httpFontsPath: '/styles/fonts', 
      relativeAssets: false, 
      assetCacheBuster: false 
     }, 
     dist: { 
      options: { 
       generatedImagesDir: '<%= yeoman.dist %>/images/generated' 
      } 
     }, 
     server: { 
      options: { 
       debugInfo: true 
      } 
     } 
    }, 
    autoprefixer: { 
     options: { 
      browsers: ['last 1 version'] 
     }, 
     dist: { 
      files: [{ 
       expand: true, 
       cwd: '.tmp/styles/', 
       src: '{,*/}*.css', 
       dest: '.tmp/styles/' 
      }] 
     } 
    }, 
    // not used since Uglify task does concat, 
    // but still available if needed 
    /*concat: { 
     dist: {} 
    },*/ 
    requirejs: { 
     dist: { 
      // Options: https://github.com/jrburke/r.js/blob/master/build/example.build.js 
      options: { 
       // `name` and `out` is set by grunt-usemin 
       name:'app', 
       out:'dist', 
       // 
       baseUrl: '<%= yeoman.app %>/scripts', 
       optimize: 'none', 
       // TODO: Figure out how to make sourcemaps work with grunt-usemin 
       // https://github.com/yeoman/grunt-usemin/issues/30 
       //generateSourceMaps: true, 
       // required to support SourceMaps 
       // http://requirejs.org/docs/errors.html#sourcemapcomments 
       preserveLicenseComments: false, 
       useStrict: false,//true 
       wrap: true 
       //uglify2: {} // https://github.com/mishoo/UglifyJS2 
       /*paths: { 
        myComponent: 'perso/wt.js' 
       }*/ 
      } 
     } 
    }, 
    rev: { 
     dist: { 
      files: { 
       src: [ 
        '<%= yeoman.dist %>/scripts/{,*/}*.js', 
        '<%= yeoman.dist %>/styles/{,*/}*.css', 
        '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp}', 
        '<%= yeoman.dist %>/styles/fonts/{,*/}*.*' 
       ] 
      } 
     } 
    }, 
    useminPrepare: { 
     options: { 
      dest: '<%= yeoman.dist %>' 
     }, 
     html: '<%= yeoman.app %>/index.php' 
    }, 
    usemin: { 
     options: { 
      dirs: ['<%= yeoman.dist %>'] 
     }, 
     html: ['<%= yeoman.dist %>/{,*/}*.php'], 
     css: ['<%= yeoman.dist %>/styles/{,*/}*.css'] 
    }, 
    imagemin: { 
     dist: { 
      files: [{ 
       expand: true, 
       cwd: '<%= yeoman.app %>/images', 
       src: '{,*/}*.{png,jpg,jpeg}', 
       dest: '<%= yeoman.dist %>/images' 
      }] 
     } 
    }, 
    svgmin: { 
     dist: { 
      files: [{ 
       expand: true, 
       cwd: '<%= yeoman.app %>/images', 
       src: '{,*/}*.svg', 
       dest: '<%= yeoman.dist %>/images' 
      }] 
     } 
    }, 
    cssmin: { 
     // This task is pre-configured if you do not wish to use Usemin 
     // blocks for your CSS. By default, the Usemin block from your 
     // `index.php` will take care of minification, e.g. 
     // 
     //  <!-- build:css({.tmp,app}) styles/main.css --> 
     // 
     // dist: { 
     //  files: { 
     //   '<%= yeoman.dist %>/styles/main.css': [ 
     //    '.tmp/styles/{,*/}*.css', 
     //    '<%= yeoman.app %>/styles/{,*/}*.css' 
     //   ] 
     //  } 
     // } 
    }, 
    htmlmin: { 
     dist: { 
      options: { 
       /*removeCommentsFromCDATA: true, 
       // https://github.com/yeoman/grunt-usemin/issues/44 
       //collapseWhitespace: true, 
       collapseBooleanAttributes: true, 
       removeAttributeQuotes: true, 
       removeRedundantAttributes: true, 
       useShortDoctype: true, 
       removeEmptyAttributes: true, 
       removeOptionalTags: true*/ 
      }, 
      files: [{ 
       expand: true, 
       cwd: '<%= yeoman.app %>', 
       src: '*.php', 
       dest: '<%= yeoman.dist %>' 
      }] 
     } 
    }, 
    // Put files not handled in other tasks here 
    copy: { 
     dist: { 
      files: [{ 
       expand: true, 
       dot: true, 
       cwd: '<%= yeoman.app %>', 
       dest: '<%= yeoman.dist %>', 
       src: [ 
        '*.{ico,png,txt}', 
        '.htaccess', 
        'images/{,*/}*.{webp,gif}', 
        'styles/fonts/{,*/}*.*', 
        'bower_components/sass-bootstrap/fonts/*.*' 
       ] 
      }] 
     }, 
     styles: { 
      expand: true, 
      dot: true, 
      cwd: '<%= yeoman.app %>/styles', 
      dest: '.tmp/styles/', 
      src: '{,*/}*.css' 
     } 
    }, 
    modernizr: { 
     devFile: '<%= yeoman.app %>/bower_components/modernizr/modernizr.js', 
     outputFile: '<%= yeoman.dist %>/bower_components/modernizr/modernizr.js', 
     files: [ 
      '<%= yeoman.dist %>/scripts/{,*/}*.js', 
      '<%= yeoman.dist %>/styles/{,*/}*.css', 
      '!<%= yeoman.dist %>/scripts/vendor/*' 
     ], 
     uglify: true 
    }, 
    concurrent: { 
     server: [ 
      'compass', 
      'copy:styles' 
     ], 
     test: [ 
      'copy:styles' 
     ], 
     dist: [ 
      'compass', 
      'copy:styles', 
      'imagemin', 
      'svgmin', 
      'htmlmin' 
     ] 
    }, 
    bower: { 
     options: { 
      exclude: ['modernizr'] 
     }, 
     all: { 
      rjsConfig: '<%= yeoman.app %>/scripts/main.js' 
     } 
    }, 
    php: { 
     watch: {}, 
     options: { 
      //port: 9000, 
      //hostname: 'wine-trip.net', 
      keepalive: true, 
      open: true, 
      base: 'app' 
     } 
    }/*, 
    ftpush: { 
     build: { 
     auth: { 
      host: 'ftp.wine-trip.net', 
      port: 21, 
      authKey: 'key1' 
     }, 
     src: '/var/www/wine-trip.yo',// 'path/to/source/folder', 
     dest: '/www-new/',// '/path/to/destination/folder', 
     exclusions: ['path/to/source/folder .DS_Store', 'path/to/source/folder Thumbs.db', 'dist/tmp'], 
     keep: ['/important/images/at/server/*.jpg'] 
     } 
    }*/ 
}); 

grunt.registerTask('server', function (target) { 
    if (target === 'dist') { 
     return grunt.task.run(['build', 'connect:dist:keepalive']); 
    } 

    grunt.task.run([ 
     'clean:server', 
     'concurrent:server', 
     'autoprefixer', 
     'connect:livereload', 
     'watch' 
    ]); 
}); 

grunt.registerTask('test', [ 
    'clean:server', 
    'concurrent:test', 
    'autoprefixer', 
    'connect:test', 
    'mocha' 
]); 

grunt.registerTask('build', [ 
    'clean:dist', 
    'useminPrepare', 
    'concurrent:dist', 
    'autoprefixer', 
    'requirejs', 
    'concat', 
    'cssmin', 
    'uglify', 
    'modernizr', 
    'copy:dist', 
    'rev', 
    'usemin' 
]); 

grunt.registerTask('default', [ 
    'jshint', 
    'test', 
    'build' 
]); 


grunt.registerTask('phpwatch', [ 
    //'connect:dist:keepalive', 
    'useminPrepare', 
    'requirejs', 
    'bower', 
    'compass', 
    'php:watch', 
    'watch:livereload', 
    'watch'//, 
    //'connect:dist:keepalive' 
]); 

//grunt.registerTask('phpwatch', ['php:watch', 'watch']); 

/*grunt.registerTask('phpwatch', function (target) { 
    if (target === 'dist') { 
     return grunt.task.run(['build', 'connect:dist:keepalive']); 
    } 

    grunt.task.run([ 
     'clean:server', 
     'concurrent:server', 
     'autoprefixer', 
     'connect:livereload', 
     'watch' 
    ]); 
});*/

};

Quelle

2013-10-14 hugsbrugs

+0

OK ich es gelöst, indem die Zeile hinzufügen: 'Kompass', in die phpwatch: grunt.registerTask. Ich war auf usemin gerichtet ... – hugsbrugs

+0

Hmmm .. gleiches Problem hier, aber Ihre Lösung funktioniert nicht für mich. Nachdem 'php: watch' mit der phpwatch-Task aufgerufen wurde, werden 'watch' und alle anderen folgenden Methoden nicht aufgerufen. Getestet Keepalive: falsch, aber das funktioniert auch nicht. Gehen 'php: watch' und 'watch' überhaupt zusammen? Wäre schön, alle Flexibilität von 'grunt server' zu haben und gleichzeitig mit' grunt phpwatch' zu arbeiten ... Irgendwelche Ideen? – MichaelKaeser

+0

@hugsbrugs können Sie die aktualisierte gruntfile, als Referenz? – John

Antwort

0

versuchen diese gruntfile.js

installieren Abhängigkeiten mit NPM installieren.

Sie müssen localhost: 9000 selbst öffnen, oder einfach Grunt-Open-Task installieren und konfigurieren.

// Generated on 2013-10-23 using generator-webapp 0.4.3 
'use strict'; 

// # Globbing 
// for performance reasons we're only matching one level down: 
// 'test/spec/{,*/}*.js' 
// use this if you want to recursively match all subfolders: 
// 'test/spec/**/*.js' 

var mountFolder = function (connect, dir) { 
    return connect.static(require('path').resolve(dir)); 
}; 

var gateway = require('gateway'); 
var phpGateway = function (dir){ 
    return gateway(require('path').resolve(dir), { 
     '.php': 'php-cgi' 
    }); 
}; 

module.exports = function (grunt) { 
    // show elapsed time at the end 
    require('time-grunt')(grunt); 
    // load all grunt tasks 
    require('load-grunt-tasks')(grunt); 

    grunt.initConfig({ 
     // configurable paths 
     yeoman: { 
      app: 'app', 
      dist: 'dist' 
     }, 
     watch: { 
      options: { 
       livereload: true 
      }, 
      coffee: { 
       files: ['<%= yeoman.app %>/scripts/{,*/}*.coffee'], 
       tasks: ['coffee:dist'] 
      }, 
      coffeeTest: { 
       files: ['test/spec/{,*/}*.coffee'], 
       tasks: ['coffee:test'] 
      }, 
      compass: { 
       files: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'], 
       tasks: ['compass:server', 'autoprefixer'] 
      }, 
      styles: { 
       files: ['<%= yeoman.app %>/styles/{,*/}*.css'], 
       tasks: ['copy:styles', 'autoprefixer'] 
      }, 
      livereload: { 
       options: { 
        livereload: '<%= connect.options.livereload %>' 
       }, 
       files: [ 
        '<%= yeoman.app %>/*.html', 
        '<%= yeoman.app %>/*.php', 
        '.tmp/styles/{,*/}*.css', 
        '{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js', 
        '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}' 
       ] 
      } 
     }, 
     connect: { 
      options: { 
       port: 9000, 
       // livereload: 35729, 
       // change this to '0.0.0.0' to access the server from outside 
       hostname: '0.0.0.0' 
      }, 
      livereload: { 
       options: { 
        // open: true, 
        // base: [ 
        //  '.tmp', 
        //  '<%= yeoman.app %>' 
        // ] 
        middleware: function (connect) { 
         return [ 
          require('connect-livereload')(), 
          phpGateway('app'), 
          mountFolder(connect, '.tmp'), 
          mountFolder(connect, 'app') 
         ]; 
        } 
       } 
      }, 
      test: { 
       options: { 
        /*base: [ 
         '.tmp', 
         'test', 
         '<%= yeoman.app %>' 
        ]*/ 
        middleware: function (connect) { 
         return [ 
          mountFolder(connect, '.tmp'), 
          mountFolder(connect, 'test'), 
          mountFolder(connect, '<%= yeoman.app %>') 
         ]; 
        } 
       } 
      }, 
      dist: { 
       options: { 
        /*open: true, 
        base: '<%= yeoman.dist %>'*/ 
        middleware: function (connect) { 
         return [ 
          mountFolder(connect, '<%= yeoman.dist %>') 
         ]; 
        } 
       } 
      } 
     }, 
     clean: { 
      dist: { 
       files: [{ 
        dot: true, 
        src: [ 
         '.tmp', 
         '<%= yeoman.dist %>/*', 
         '!<%= yeoman.dist %>/.git*' 
        ] 
       }] 
      }, 
      server: '.tmp' 
     }, 
     jshint: { 
      options: { 
       jshintrc: '.jshintrc' 
      }, 
      all: [ 
       'Gruntfile.js', 
       '<%= yeoman.app %>/scripts/{,*/}*.js', 
       '!<%= yeoman.app %>/scripts/vendor/*', 
       'test/spec/{,*/}*.js' 
      ] 
     }, 
     mocha: { 
      all: { 
       options: { 
        run: false, 
        urls: ['http://<%= connect.test.options.hostname %>:<%= connect.test.options.port %>/index.php'] 
       } 
      } 
     }, 
     coffee: { 
      options: { 
       bare: true 
      }, 
      dist: { 
       files: [{ 
        expand: true, 
        cwd: '<%= yeoman.app %>/scripts', 
        src: '{,*/}*.coffee', 
        dest: '.tmp/scripts', 
        ext: '.js' 
       }] 
      }, 
      test: { 
       files: [{ 
        expand: true, 
        cwd: 'test/spec', 
        src: '{,*/}*.coffee', 
        dest: '.tmp/spec', 
        ext: '.js' 
       }] 
      } 
     }, 
     compass: { 
      options: { 
       sassDir: '<%= yeoman.app %>/styles', 
       cssDir: '.tmp/styles', 
       generatedImagesDir: '.tmp/images/generated', 
       imagesDir: '<%= yeoman.app %>/images', 
       javascriptsDir: '<%= yeoman.app %>/scripts', 
       fontsDir: '<%= yeoman.app %>/styles/fonts', 
       importPath: '<%= yeoman.app %>/bower_components', 
       httpImagesPath: '/images', 
       httpGeneratedImagesPath: '/images/generated', 
       httpFontsPath: '/styles/fonts', 
       relativeAssets: false, 
       assetCacheBuster: false 
      }, 
      dist: { 
       options: { 
        generatedImagesDir: '<%= yeoman.dist %>/images/generated' 
       } 
      }, 
      server: { 
       options: { 
        debugInfo: true 
       } 
      } 
     }, 
     autoprefixer: { 
      options: { 
       browsers: ['last 1 version'] 
      }, 
      dist: { 
       files: [{ 
        expand: true, 
        cwd: '.tmp/styles/', 
        src: '{,*/}*.css', 
        dest: '.tmp/styles/' 
       }] 
      } 
     }, 
     // not used since Uglify task does concat, 
     // but still available if needed 
     /*concat: { 
      dist: {} 
     },*/ 
     requirejs: { 
      dist: { 
       // Options: https://github.com/jrburke/r.js/blob/master/build/example.build.js 
       options: { 
        // `name` and `out` is set by grunt-usemin 
        // dir: '<%= yeoman.dist %>/scripts', 
        baseUrl: '<%= yeoman.app %>/scripts', 
        optimize: 'none', // uglify, uglify2, closure, closure.keepLines, none 
        // TODO: Figure out how to make sourcemaps work with grunt-usemin 
        // https://github.com/yeoman/grunt-usemin/issues/30 
        //generateSourceMaps: true, 
        // required to support SourceMaps 
        // http://requirejs.org/docs/errors.html#sourcemapcomments 
        preserveLicenseComments: false, 
        useStrict: true, 
        wrap: true 
        //uglify2: {} // https://github.com/mishoo/UglifyJS2 
       } 
      } 
     }, 
     rev: { 
      dist: { 
       files: { 
        src: [ 
         '<%= yeoman.dist %>/scripts/{,*/}*.js', 
         '<%= yeoman.dist %>/styles/{,*/}*.css', 
         '<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp}', 
         '<%= yeoman.dist %>/styles/fonts/{,*/}*.*' 
        ] 
       } 
      } 
     }, 
     useminPrepare: { 
      options: { 
       dest: '<%= yeoman.dist %>' 
      }, 
      html: '<%= yeoman.app %>/index.php' 
     }, 
     usemin: { 
      options: { 
       dirs: ['<%= yeoman.dist %>'] 
      }, 
      html: ['<%= yeoman.dist %>/{,*/}*.php'], 
      css: ['<%= yeoman.dist %>/styles/{,*/}*.css'] 
     }, 
     imagemin: { 
      dist: { 
       files: [{ 
        expand: true, 
        cwd: '<%= yeoman.app %>/images', 
        src: '{,*/}*.{png,jpg,jpeg}', 
        dest: '<%= yeoman.dist %>/images' 
       }] 
      } 
     }, 
     svgmin: { 
      dist: { 
       files: [{ 
        expand: true, 
        cwd: '<%= yeoman.app %>/images', 
        src: '{,*/}*.svg', 
        dest: '<%= yeoman.dist %>/images' 
       }] 
      } 
     }, 
     cssmin: { 
      // This task is pre-configured if you do not wish to use Usemin 
      // blocks for your CSS. By default, the Usemin block from your 
      // `index.html` will take care of minification, e.g. 
      // 
      //  <!-- build:css({.tmp,app}) styles/main.css --> 
      // 
      // dist: { 
      //  files: { 
      //   '<%= yeoman.dist %>/styles/main.css': [ 
      //    '.tmp/styles/{,*/}*.css', 
      //    '<%= yeoman.app %>/styles/{,*/}*.css' 
      //   ] 
      //  } 
      // } 
     }, 
     htmlmin: { 
      dist: { 
       options: { 
        /*removeCommentsFromCDATA: true, 
        // https://github.com/yeoman/grunt-usemin/issues/44 
        //collapseWhitespace: true, 
        collapseBooleanAttributes: true, 
        removeAttributeQuotes: true, 
        removeRedundantAttributes: true, 
        useShortDoctype: true, 
        removeEmptyAttributes: true, 
        removeOptionalTags: true*/ 
       }, 
       files: [{ 
        expand: true, 
        cwd: '<%= yeoman.app %>', 
        src: '*.php', 
        dest: '<%= yeoman.dist %>' 
       }] 
      } 
     }, 
     // Put files not handled in other tasks here 
     copy: { 
      dist: { 
       files: [{ 
        expand: true, 
        dot: true, 
        cwd: '<%= yeoman.app %>', 
        dest: '<%= yeoman.dist %>', 
        src: [ 
         '*.{ico,png,txt}', 
         '.htaccess', 
         'images/{,*/}*.{webp,gif}', 
         'styles/fonts/{,*/}*.*', 
         'bower_components/normalize-css/normalize.css' 
        ] 
       }] 
      }, 
      styles: { 
       expand: true, 
       dot: true, 
       cwd: '<%= yeoman.app %>/styles', 
       dest: '.tmp/styles/', 
       src: '{,*/}*.css' 
      } 
     }, 
     modernizr: { 
      devFile: '<%= yeoman.app %>/bower_components/modernizr/modernizr.js', 
      outputFile: '<%= yeoman.dist %>/bower_components/modernizr/modernizr.js', 
      files: [ 
       '<%= yeoman.dist %>/scripts/{,*/}*.js', 
       '<%= yeoman.dist %>/styles/{,*/}*.css', 
       '!<%= yeoman.dist %>/scripts/vendor/*' 
      ], 
      uglify: true 
     }, 
     concurrent: { 
      server: [ 
       'compass', 
       'coffee:dist', 
       'copy:styles' 
      ], 
      test: [ 
       'coffee', 
       'copy:styles' 
      ], 
      dist: [ 
       'coffee', 
       'compass', 
       'copy:styles', 
       'imagemin', 
       'svgmin', 
       'htmlmin' 
      ] 
     }, 
     bower: { 
      options: { 
       exclude: ['modernizr'] 
      }, 
      all: { 
       rjsConfig: '<%= yeoman.app %>/scripts/main.js' 
      } 
     } 
    }); 

    grunt.registerTask('server', function (target) { 
     if (target === 'dist') { 
      return grunt.task.run(['build', 'connect:dist:keepalive']); 
     } 

     grunt.task.run([ 
      'clean:server', 
      'concurrent:server', 
      'autoprefixer', 
      'connect:livereload', 
      'watch' 
     ]); 
    }); 

    grunt.registerTask('test', [ 
     'clean:server', 
     'concurrent:test', 
     'autoprefixer', 
     'connect:test', 
     'mocha' 
    ]); 

    grunt.registerTask('build', [ 
     'clean:dist', 
     'useminPrepare', 
     'concurrent:dist', 
     'autoprefixer', 
     'requirejs', 
     'concat', 
     'cssmin', 
     'uglify', 
     'modernizr', 
     'copy:dist', 
     'rev', 
     'usemin' 
    ]); 

    grunt.registerTask('default', [ 
     'jshint', 
     'test', 
     'build' 
    ]); 
};

und

{ 
    "name": "sitename.com", 
    "version": "0.0.0", 
    "dependencies": {}, 
    "devDependencies": { 
    "grunt": "~0.4.1", 
    "grunt-contrib-copy": "~0.4.1", 
    "grunt-contrib-concat": "~0.3.0", 
    "grunt-contrib-coffee": "~0.7.0", 
    "grunt-contrib-uglify": "~0.2.0", 
    "grunt-contrib-compass": "~0.5.0", 
    "grunt-contrib-jshint": "~0.6.3", 
    "grunt-contrib-cssmin": "~0.6.1", 
    "grunt-contrib-connect": "~0.5.0", 
    "grunt-contrib-clean": "~0.5.0", 
    "grunt-contrib-htmlmin": "~0.1.3", 
    "grunt-bower-requirejs": "~0.7.0", 
    "grunt-contrib-requirejs": "~0.4.1", 
    "grunt-contrib-imagemin": "~0.2.0", 
    "grunt-contrib-watch": "~0.5.2", 
    "grunt-rev": "~0.1.0", 
    "grunt-autoprefixer": "~0.2.0", 
    "grunt-usemin": "~0.1.10", 
    "grunt-mocha": "~0.4.0", 
    "grunt-modernizr": "~0.3.0", 
    "grunt-svgmin": "~0.2.0", 
    "grunt-concurrent": "~0.3.0", 
    "load-grunt-tasks": "~0.1.0", 
    "time-grunt": "~0.1.1", 
    "gateway": "~0.1.1", 
    "connect-livereload": "~0.3.0" 
    }, 
    "engines": { 
    "node": ">=0.8.0" 
    } 
}

Quelle

2013-12-09 22:56:20

 Verwandte Themen

  • Keine verwandten Themen^_^