Gruntjs Shopify livereload grunt

Gruntjs Shopify livereload grunt,gruntjs,shopify,livereload,Gruntjs,Shopify,Livereload,是否有人让Shopify LiveReload为其工作流开发工作,并与grunt合作?请记住,在查看开发的实时预览时,它不是本地存储的,而是通过shopify的自定义url存储的 如果有人知道如何让livereload在shopify上工作,我将不胜感激 提前谢谢 我的Grunfile: 'use strict'; // # Globbing // for performance reasons we're only matching one level down: // 'test/spec

是否有人让Shopify LiveReload为其工作流开发工作,并与grunt合作?请记住,在查看开发的实时预览时,它不是本地存储的,而是通过shopify的自定义url存储的

如果有人知道如何让livereload在shopify上工作,我将不胜感激

提前谢谢

我的Grunfile:

'use strict';

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

module.exports = function (grunt) {
    // load all grunt tasks
    require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);

    // configurable paths
    var yeomanConfig = {
        app: '.',
        dist: 'fahey-rodriguez4877-7509645'
    };

    grunt.initConfig({
        yeoman: yeomanConfig,
        watch: {
            compass: {
                files: ['<%= yeoman.app %>/styles/{,*/}*.{scss,sass}'],
                tasks: ['compass:live'],
                options: {
                    livereload: true
                }
            },
            css: {
                files: ['.tmp/styles/*.css'],
                tasks: ['cssmin'],
                options: {
                    livereload: true
                }
            },
            js: {
                files: ['<%= yeoman.app %>/scripts/*.js'],
                tasks: ['concat:live'],
                options: {
                    livereload: true
                }
            },
            update: {
                files: ['<%= yeoman.app %>/{layout,templates,snippets}/*.liquid'],
                tasks: ['sync'],
                options: {
                    livereload: true
                }
            },
            config: {
                files: ['<%= yeoman.app %>/config/*.{html,json}'],
                tasks: ['copy']
            },
        },
        clean: {
            dist: [
                '.tmp',
                '<%= yeoman.dist %>/*'
            ]
        },
        jshint: {
            options: {
                jshintrc: '.jshintrc'
            },
            all: [
                'Gruntfile.js',
                '<%= yeoman.app %>/scripts/{,*/}*.js'
            ]
        },
        compass: {
            options: {
                sassDir: '<%= yeoman.app %>/styles',
                cssDir: '.tmp/styles',
                imagesDir: '<%= yeoman.app %>/assets',
                javascriptsDir: '<%= yeoman.app %>/scripts',
                fontsDir: '<%= yeoman.app %>/assets',
                importPath: 'components',
                relativeAssets: true
            },
            dist: {},
            live: {
                options: {
                    debugInfo: true,
                }
            }
        },
        uglify: {
            dist: {
                files: {
                    '<%= yeoman.dist %>/assets/custom.modernizr.js': [
                        '<%= yeoman.app %>/components/foundation/js/vendor/custom.modernizr.js'
                    ],
                    '<%= yeoman.dist %>/assets/main.js': [
                        '<%= yeoman.app %>/components/foundation/js/vendor/jquery.js',
                        '<%= yeoman.app %>/components/foundation/js/foundation/foundation.js',
                        '<%= yeoman.app %>/components/foundation/js/foundation/foundation.*.js',
                        '<%= yeoman.app %>/scripts/{,*/}*.js'
                    ],
                }
            },
        },
        concat: {
            live: {
                files: {
                    '<%= yeoman.dist %>/assets/custom.modernizr.js': [
                        '<%= yeoman.app %>/components/foundation/js/vendor/custom.modernizr.js'
                    ],
                    '<%= yeoman.dist %>/assets/main.js': [
                        '<%= yeoman.app %>/components/foundation/js/vendor/jquery.js',
                        '<%= yeoman.app %>/components/foundation/js/foundation/foundation.js',
                        '<%= yeoman.app %>/components/foundation/js/foundation/foundation.*.js',
                        '<%= yeoman.app %>/scripts/{,*/}*.js'
                    ],
                }
            }
        },
        imagemin: {
            dist: {
                files: [{
                    expand: true,
                    cwd: '<%= yeoman.app %>/assets',
                    src: '{,*/}*.{png,jpg,jpeg}',
                    dest: '<%= yeoman.dist %>/assets'
                }]
            }
        },
        cssmin: {
            dist: {
                files: {
                    '<%= yeoman.dist %>/assets/main.css': [
                        '.tmp/styles/{,*/}*.css',
                        '<%= yeoman.app %>/styles/{,*/}*.css'
                    ]
                }
            }
        },
        sync: {
            main: {
                files: [{
                  cwd: '<%= yeoman.app %>',
                  src: [
                            'assets/*',
                            'config/*',
                            'layout/*',
                            'snippets/*',
                            'templates/*',
                        ],
                  dest: '<%= yeoman.dist %>',
                }]
            }
        },
        copy: {
            dist: {
                files: [{
                    expand: true,
                    dot: true,
                    cwd: '<%= yeoman.app %>',
                    dest: '<%= yeoman.dist %>',
                    src: [
                        'assets/*',
                        'config/*',
                        'layout/*',
                        'snippets/*',
                        'templates/*',
                    ]
                },{
                    expand: true,
                    cwd: '<%= yeoman.app %>/components/font-awesome/font',
                    dest: '<%= yeoman.dist %>/assets',
                    src: [
                        '*'
                    ]
                }]
            },
        }
    });

    grunt.renameTask('regarde', 'watch');

    grunt.registerTask('live', [
        'clean:dist',
        'compass:live',
        'cssmin',
        'concat:live',
        'copy',
        'watch'
    ]);

    grunt.registerTask('build', [
        'clean:dist',
        'compass:dist',
        'cssmin',
        'imagemin',
        'uglify',
        'copy'
    ]);

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

嘿,这也太棒了,因为我在所有项目中都使用LiveReload,但我认为它实际上是用于本地web开发服务器,而不是实时服务器,或者在这种情况下,shopify在这方面不给您任何服务器级控制

然而,这里有一个很棒的

在本地编辑文件时,它基本上会监视任何文件更改,然后自动将它们上传到相应的shopify商店/主题,我根本没有遇到任何问题,而且它节省了大量时间

希望这有助于: