0

Win8 マシンで Grunt をセットアップして['sass', 'autoprefixer', 'connect', 'watch']、ブラウザでライブ リフレッシュとデザインを問題なく実行するタスクを実行しました。プロセスはフォルダーの変更を監視し、SCSS から CSS にコンパイルし、ブラウザーを正常に更新しました。

その後、昨夜遅くにディスク上のディレクトリの名前を変更しました-からc:\ruby-sass-susyにc:\libsass-susy。悲しいことに、これは私のセットアップを台無しにしました:(

ここで、デフォルトを実行するとgrunt、サーバーが起動し、最初にファイルがコンパイルされ、プロジェクトが正常に動作する準備が整った状態でブラウザーが起動します。

しかし、変更して保存.scssしても何もコンパイルされません。コマンドラインに表示されるもの：

Running "watch" task
Waiting...
>> File "scss\00-config\_config.scss" changed.

しかし、コンパイルは行われずglobal.css、関連するマップ ファイルは作成されず、アクティビティはまったくありません。

私が試したこと：

  • npm uninstall <package>関連するwatch、 connect
    およびgrunt-sassパッケージのそれぞれについて。

  • npm install <package> --save-dev3つすべてで、3つすべてのクリーンな再インストールを取得します

  • それから（それが何もしなかったとき）私は新しいディレクトリで始めました- mypackage.jsonとを使用してbower.json、新しいディレクトリにすべての依存関係を最初から再インストールし、 にコピーし、Gruntfileすべてをもう一度実行してテストしました

新しいディレクトリでも同じ結果が得られます。どうしたの？問題は、Node または npm のインストールのさらに先にあるのでしょうか? 何かが正しいディレクトリを指していませんか? (すみません、私は Grunt や JavaScript プログラミングの専門家ではありません)

これが私の Gruntfile です。関連するビットです。デフォルトで実行していないパッケージは省略しました。

~~~

// Gruntfile for LibSass - 03/26/15

module.exports = function(grunt) {

'use strict';

grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-autoprefixer');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-connect');
grunt.loadNpmTasks('grunt-contrib-watch');

grunt.initConfig({

    pkg: grunt.file.readJSON('package.json'),

    // Sass (grunt-sass)
    sass: {
        options: {
            sourceMap: true, // Create source map
            outputStyle: 'expanded' // Specify output
        },
        dist: {

            files: [
                {
                    expand: true, // Recursive
                    cwd: "scss", // The startup directory
                    src: ["**/*.scss"], // Source files
                    dest: "css", // Destination
                    ext: ".css" // File extension 
                }
            ]
        }
    },


    // Autoprefixer
    autoprefixer: {
        options: {
            browsers: ['last 2 versions'],
            map: true // Update source map (creates one if it can't find an existing map)
        },

        // Prefix all files
        multiple_files: {
            src: 'css/**/*.css'
        },
    },

    // Grunt connect (server)
    connect: {
        server: {
            options: {
                livereload: 1337,
                port: 9001,
                base: '',
                open: {
                    target: 'http://localhost:9001/',
                }
            }
        },
    },

    // Watch!
    watch: {
      sass: {
        files: ['scss/**/*.{scss,sass}'],
      },

      livereload: {
        files: ['*.html', '*.php', 'img/**/*.{png,jpg,jpeg,gif,webp,svg}'],
        options: {
          livereload: true,
        },
      },
    }
});

// Default Sass Server
grunt.registerTask('default', ['sass', 'autoprefixer', 'connect', 'watch']);

};
4

1 に答える 1

0

参考までに、grunt-contrib-connect サーバーを grunt-browser-sync -- Browser Syncに置き換えることで、この問題を解決しました。

問題を追跡し、「接続」サーバーに関する他の人々の経験を読んだ後、それはおそらく問題を抱えているすべての人に共通していることの 1 つであるように思われました。だから私はそれを捨てて、新しい解決策をつなぎました。

これまでのところ、うまく機能しています！非常に信頼性が高く高速なサーバーであり、リアルタイムで複数のデバイスのブラウザーを同期および更新するなどの追加機能も備えています。

于 2015-03-29T06:50:53.060 に答える