2017-03-07 48 views
1

我試圖用Karma運行我的Jasmine測試,我相信應該加載的一些模塊沒有加載,它可能是依賴性問題,但我用完了想法。與Karma一起使用Webpack導致節點模塊加載錯誤

karma.conf.js

var webpackConfig = require('./webpack.config.js'); 
webpackConfig.entry = {}; 

module.exports = function(config) { 
    config.set({ 
    // base path that will be used to resolve all patterns (eg. files, exclude) 
    basePath: '', 
    // frameworks to use 
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter 
    frameworks: ['jasmine'], 
    // list of files/patterns to load in the browser 
    files: [ 
     { pattern: 'test-context.js'} 
    ], 
    // list of files to exclude 
    exclude: [ 
    ], 
    // preprocess matching files before serving them to the browser 
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor 
    preprocessors: { 
     'test-context.js': ['webpack'] 
    }, 
    webpack: webpackConfig, 
    webpackMiddleware: { 
     noInfo: true 
    }, 
    // test results reporter to use 
    // possible values: 'dots', 'progress' 
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter 
    reporters: ['progress'], 
    // web server port 
    port: 9876, 
    // enable/disable colors in the output (reporters and logs) 
    colors: true, 
    // level of logging 
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG 
    logLevel: config.LOG_INFO, 
    // enable/disable watching file and executing tests whenever any file changes 
    autoWatch: true, 
    // start these browsers 
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher 
    browsers: ['Chrome'], 
    // Continuous Integration mode 
    // if true, Karma captures browsers, runs the tests and exits 
    singleRun: false, 
    // Concurrency level 
    // how many browser should be started simultaneous 
    concurrency: Infinity, 
    debug: true 
    }) 
} 

webpack.config.js

var path = require('path'); 
var webpack = require('webpack'); 

module.exports = { 
    entry: [ 
    'babel-polyfill', 
    './index.js' 
    ], 
    output: { 
     publicPath: '/', 
     filename: 'main.js' 
    }, 
    devtool: 'source-map', 
    resolve: { 
    extensions: ['', '.js', '.jsx'] 
    }, 
    module: { 
    rules: [ 
     { 
     test: /\.json$/, 
     use: 'json-loader' 
     } 
    ], 
    loaders: [ 
     { 
     test: /\.js$/, 
     loader: 'babel-loader', 
     exclude: /node_modules/ 
     }, 
     { 
     test: /\.json$/, 
     loader: 'json-loader' 
     } 
    ] 
    }, 
    node: { 
    net: 'empty', 
    tls: 'empty', 
    //dns: 'empty', 
    fs: 'empty' 
    }, 
    externals: { 
    //'crypto': 'crypto' 
    }, 
    debug: true 
}; 

的package.json

{ 
    "name": "Web-Application", 
    "version": "0.0.1", 
    "description": "A web application", 
    "engines": { 
    "node": "5.9.1" 
    }, 
    "main": "index.js", 
    "scripts": { 
    "start": "node index.js", 
    "tests": "karma start" 
    }, 
    "dependencies": { 
    "babel-preset-es2015": "^6.22.0", 
    "babel-preset-react": "^6.23.0", 
    "babel-register": "^6.23.0", 
    "box-node-sdk": "^1.3.0", 
    "ejs": "2.4.1", 
    "express": "4.13.3", 
    "node-libs-browser": "^2.0.0", 
    "crypto-browserify": "^3.11.0" 
    }, 
    "repository": { 
    "type": "git", 
    "url": "https://github.com/heroku/node-js-getting-started" 
    }, 
    "keywords": [ 
    "node", 
    "heroku", 
    "express" 
    ], 
    "license": "MIT", 
    "devDependencies": { 
    "babel-cli": "^6.23.0", 
    "babel-core": "^6.23.1", 
    "babel-loader": "^v6.4.0", 
    "babel-preset-env": "^1.2.0", 
    "babel-preset-es2015": "^6.22.0", 
    "express": "4.13.3", 
    "jasmine-core": "^2.5.2", 
    "json-loader": "^0.5.4", 
    "karma": "^1.5.0", 
    "karma-babel-preprocessor": "^6.0.1", 
    "karma-chrome-launcher": "^2.0.0", 
    "karma-jasmine": "^1.1.0", 
    "karma-phantomjs2-launcher": "^0.5.0", 
    "karma-webpack": "^2.0.2", 
    "webpack": "^1.3.0", 
    "webpack-dev-server": "1.10.1" 
    } 
} 

我加

node: { 
    net: 'empty', 
    tls: 'empty', 
    //dns: 'empty', 
    fs: 'empty' 
    }, 

到代碼刪除以前的依賴問題,但是這可能只是固定的業務層,也許還有更深層次的依賴問題。

堆棧跟蹤:

enter image description here

enter image description here

GIT中源

https://github.com/noobiehacker/revaBoxWeb

任何幫助或提示理解> <

回答

0

這個例子是使用一個express Node.js的應用程序,這需要Node.js的內置模塊等fsnet或。但是,您嘗試使用webpack構建Web應用程序(默認目標是web),並且在瀏覽器中這些模塊不可用。 Webpack告訴你,這些模塊無法解決,但你決定清空它們,這會給你帶來運行時錯誤。

爲了將express與webpack一起使用,您需要將target配置爲node,因此webpack不會觸摸內置模塊。

target: 'node' 

您還需要刪除之前添加的node配置。

I am trying to just run my Jasmine Test with Karma

正如上面提到的,你正在構建一個Node.js的應用程序,但Karma是一個瀏覽器測試工具。它將無法運行你的代碼。您的代碼旨在由節點運行,並且也由節點而不是瀏覽器進行測試。

+0

嘿邁克爾,感謝您的反饋,我已經嘗試過您的解決方案,但我現在得到這個錯誤:「未捕獲的ReferenceError:需求未定義」,也許我應該找到一種方法來加載庫到瀏覽器或不甚至一起使用業力? – noobiehacker

+0

你不能將這些加載到瀏覽器中,並且webpack會將調用'require('fs')'和其他內置模塊保持原樣,以便節點可以直接使用它們,'require'在瀏覽器中不存在,甚至如果確實如此,則無法訪問瀏覽器中的文件系統。你不能使用Karma來測試一個快速的應用程序,並且在這種情況下你不需要它,Jasmine就足夠了,它不依賴於瀏覽器。 –

+0

那麼你是否建議不要使用chrome並使用phantonjs作爲瀏覽器選項? – noobiehacker

相關問題