Karma js将不提供图片文件。

Question

Karma似乎不能为我的项目中的任何图像服务。我当前的业力配置如下：

module.exports = function (config) {
    config.set({

        /**
         * These are the files required to run the tests.
         *
         * The `Function.prototype.bind` polyfill is required by PhantomJS
         * because it uses an older version of JavaScript.
         */
        files: [
            {pattern: "src/assets/images/*.png", watched: false, included: false, served: true},
            './Unit_Tests/polyfill.js',
            './Unit_Tests/main.js'

        ],

        proxies: {
            "/img/": "/src/assets/images/"
        },
        /**
         * The actual tests are preprocessed by the karma-webpack plugin, so that
         * their source can be properly transpiled.
         */
        preprocessors: {
            './Unit_Tests/main.js': ['webpack'],
            '**/*.less': ['less']
        },


        /**
         * We want to run the tests using the PhantomJS headless browser.
         * This is especially useful for continuous integration.
         */
        browsers: ['PhantomJS'],

        /**
         * Use Mocha as the test framework, Sinon for mocking, and
         * Chai for assertions.
         */
        frameworks: ['mocha', 'sinon-chai'],

        /**
         * After running the tests, return the results and generate a
         * code coverage report.
         */
        reporters: ['progress', 'coverage'],

        /**
         * When generating a code coverage report, use `lcov` format and
         * place the result in coverage/lcov.info
         *
         * This file will be sent to Coveralls by the `coveralls` npm script.
         */
        coverageReporter: {
            dir: 'coverage/',
            reporters: [
                {type: 'lcovonly', subdir: '.', file: 'lcov.info'},
                {type: 'html', subdir: 'html'}
            ]
        },

        /**
         * The configuration for the karma-webpack plugin.
         *
         * This is very similar to the main webpack.local.config.js, with the
         * exception of specifying an istanbul-transformer post loader so
         * that we can generate an accurate code coverage report.
         */
        webpack: {
            module: {
                loaders: [
                    {test: /\.jsx?$/, exclude: /node_modules/, loader: "babel-loader?stage=0"},
                    {test: /\.less$/, loader: "style!css!less"}
                ],
                postLoaders: [{
                    test: /\.jsx?$/,
                    exclude: /(test|node_modules)\//,
                    loader: 'istanbul-instrumenter'
                }]
            },
            resolve: {
                extensions: ['', '.js', '.jsx', '.css', '.less']
            }
        },

        /**
         * Configuration option to turn off verbose logging of webpack compilation.
         */
        webpackMiddleware: {
            noInfo: true
        },

        /**
         * Once the mocha test suite returns, we want to exit from the test runner as well.
         */
        singleRun: true,

        /**
         * List of plugins
         */
        plugins: [
            'karma-mocha',
            'karma-webpack',
            'karma-coverage',
            'karma-sinon-chai',
            'karma-phantomjs-launcher'
        ],
    });
}

我总是会犯这样的错误：

  Error: Cannot find module "../assets/images/downloadios.png"

如果我用这个设置运行它：

module.exports = function (config) {
    config.set({

        /**
         * These are the files required to run the tests.
         *
         * The `Function.prototype.bind` polyfill is required by PhantomJS
         * because it uses an older version of JavaScript.
         */
        files: [
            'src/**/*.png',
            './Unit_Tests/polyfill.js',
            './Unit_Tests/main.js'

        ],
        /**
         * The actual tests are preprocessed by the karma-webpack plugin, so that
         * their source can be properly transpiled.
         */
        preprocessors: {
            './Unit_Tests/main.js': ['webpack'],
            '**/*.less': ['less']
        },


        /**
         * We want to run the tests using the PhantomJS headless browser.
         * This is especially useful for continuous integration.
         */
        browsers: ['PhantomJS'],

        /**
         * Use Mocha as the test framework, Sinon for mocking, and
         * Chai for assertions.
         */
        frameworks: ['mocha', 'sinon-chai'],

        /**
         * After running the tests, return the results and generate a
         * code coverage report.
         */
        reporters: ['progress', 'coverage'],

        /**
         * When generating a code coverage report, use `lcov` format and
         * place the result in coverage/lcov.info
         *
         * This file will be sent to Coveralls by the `coveralls` npm script.
         */
        coverageReporter: {
            dir: 'coverage/',
            reporters: [
                {type: 'lcovonly', subdir: '.', file: 'lcov.info'},
                {type: 'html', subdir: 'html'}
            ]
        },

        /**
         * The configuration for the karma-webpack plugin.
         *
         * This is very similar to the main webpack.local.config.js, with the
         * exception of specifying an istanbul-transformer post loader so
         * that we can generate an accurate code coverage report.
         */
        webpack: {
            module: {
                loaders: [
                    {test: /\.jsx?$/, exclude: /node_modules/, loader: "babel-loader?stage=0"},
                    {test: /\.less$/, loader: "style!css!less"}
                ],
                postLoaders: [{
                    test: /\.jsx?$/,
                    exclude: /(test|node_modules)\//,
                    loader: 'istanbul-instrumenter'
                }]
            },
            resolve: {
                extensions: ['', '.js', '.jsx', '.css', '.less']
            }
        },

        /**
         * Configuration option to turn off verbose logging of webpack compilation.
         */
        webpackMiddleware: {
            noInfo: true
        },

        /**
         * Once the mocha test suite returns, we want to exit from the test runner as well.
         */
        singleRun: true,

        /**
         * List of plugins
         */
        plugins: [
            'karma-mocha',
            'karma-webpack',
            'karma-coverage',
            'karma-sinon-chai',
            'karma-phantomjs-launcher'
        ]
    });
   }

我知道这个错误：

SyntaxError: Parse error
at path/to/src/assets/images/downloadandroid.png:1

我已经研究了几个小时了，似乎找不到一个组合来让这件事快乐。我不明白我做错了什么，我已经看了所有业力js的例子，我可以找到，似乎没有任何工作。

Answer 1

因此，当我将以下内容添加到我的karma.config.js中时，它将解决这个问题

        webpack: {
        module: {
            loaders: [
                {test: /\.jsx?$/, exclude: /node_modules/, loader: "babel-loader?stage=0"},
                {test: /\.less$/, loader: "style!css!less"},


               {test: /\.(png|jpg)$/, loader: 'url-loader?limit=8192'}

            ],
            postLoaders: [{
                test: /\.jsx?$/,
                exclude: /(test|node_modules)\//,
                loader: 'istanbul-instrumenter'
            }]
        },
        resolve: {
            extensions: ['', '.js', '.jsx', '.css', '.less']
        }
    },

{test: /.(png\jpg)$/，加载程序：‘url-加载程序?限制=8192’}