Ich versuche, Jasmine mit Webpack zu arbeiten

Question

Ich versuche ein Projekt von TSC zu Webpack migrieren, damit ich alle Skripte bündeln kann. Im Moment stoße ich auf ein Problem mit Jasmine: TS2304: Kann den Namen 'beschreiben' nicht finden. Hier ist mein Karma config:

module.exports = function(config) { 

    var appBase = 'app/';  // transpiled app JS and map files 
    var appSrcBase = 'app/';  // app source TS files 
    var appAssets = '/base/app/'; // component assets fetched by Angular's compiler 

    // Testing helpers (optional) are conventionally in a folder called `testing` 
    var testingBase = 'testing/'; // transpiled test JS and map files 
    var testingSrcBase = 'testing/'; // test source TS files 

    config.set({ 
    basePath: '', 
    frameworks: ['jasmine'], 

    plugins: [ 
     require('karma-jasmine'), 
     require('karma-chrome-launcher'), 
     require('karma-jasmine-html-reporter') 
    ], 

    client: { 
     builtPaths: [appBase, testingBase], // add more spec base paths as needed 
     clearContext: false // leave Jasmine Spec Runner output visible in browser 
    }, 

    customLaunchers: { 
     // From the CLI. Not used here but interesting 
     // chrome setup for travis CI using chromium 
     Chrome_travis_ci: { 
     base: 'Chrome', 
     flags: ['--no-sandbox'] 
     } 
    }, 

    files: [ 
     // System.js for module loading 
     'node_modules/systemjs/dist/system.src.js', 

     // Polyfills 
     'node_modules/core-js/client/shim.js', 

     // zone.js 
     'node_modules/zone.js/dist/zone.js', 
     'node_modules/zone.js/dist/long-stack-trace-zone.js', 
     'node_modules/zone.js/dist/proxy.js', 
     'node_modules/zone.js/dist/sync-test.js', 
     'node_modules/zone.js/dist/jasmine-patch.js', 
     'node_modules/zone.js/dist/async-test.js', 
     'node_modules/zone.js/dist/fake-async-test.js', 

     // RxJs 
     { pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false }, 
     { pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false }, 

     // Paths loaded via module imports: 
     // Angular itself 
     { pattern: 'node_modules/@angular/**/*.js', included: false, watched: false }, 
     { pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false }, 

     { pattern: 'systemjs.config.js', included: false, watched: false }, 
     'karma-test-shim.js', // optionally extend SystemJS mapping e.g., with barrels 

     // transpiled application & spec code paths loaded via module imports 
     { pattern: appBase + '**/*.js', included: false, watched: true }, 
     { pattern: testingBase + '**/*.js', included: false, watched: true }, 


     // Asset (HTML & CSS) paths loaded via Angular's component compiler 
     // (these paths need to be rewritten, see proxies section) 
     { pattern: appBase + '**/*.html', included: false, watched: true }, 
     { pattern: appBase + '**/*.css', included: false, watched: true }, 

     // Paths for debugging with source maps in dev tools 
     { pattern: appSrcBase + '**/*.ts', included: false, watched: false }, 
     { pattern: appBase + '**/*.js.map', included: false, watched: false }, 
     { pattern: testingSrcBase + '**/*.ts', included: false, watched: false }, 
     { pattern: testingBase + '**/*.js.map', included: false, watched: false} 
    ], 

    // Proxied base paths for loading assets 
    proxies: { 
     // required for component assets fetched by Angular's compiler 
     "/app/": appAssets 
    }, 

    exclude: [], 
    preprocessors: {}, 
    reporters: ['progress', 'kjhtml'], 
    webpack: require('./webpack.config.js'), 

    port: 9876, 
    colors: true, 
    logLevel: config.LOG_INFO, 
    autoWatch: true, 
    browsers: ['Chrome'], 
    singleRun: false 
    }) 
} 

Hier ist mein webpack config:

var ExtractTextPlugin = require('extract-text-webpack-plugin'); 

module.exports = { 
    entry: ["./src/ts/main.ts","./src/ts/css.ts"], 
    module: { 
     rules: [ 
     { 
      test: /\.ts$/, 
      loaders: [ 
      { 
       loader: 'awesome-typescript-loader', 
       options: { configFileName: 'tsconfig.json' } 
      } , 'angular2-template-loader' 
      ] 
     }, 
     { 
      test: /\.jsx$/, 
      use: "babel-loader" 
     }, 
     { 
      test: /\.html$/, 
      use: "html-loader" 
     }, 
     { 
      test: /\.css$/, 
      use: ExtractTextPlugin.extract({use: 'css-loader'}) 
     }, 
     { 
      test: /\.(jpe?g|png|gif|svg)$/i, 
      use: ['url-loader?limit=10000', 'img-loader'] 
     }, 
     { 
      test: /\.(eot|woff2?|ttf)$/i, 
      use: 'url-loader' 
     } 
     ] 
    }, 
    resolve: { 
    extensions: [".tsx", ".ts", ".js"] 
    }, 
    plugins: [ 
    new ExtractTextPlugin("public/styles.css"), 
    ], 
    output: { 
    filename: "public/bundle.js" 
    } 
} 

Ich erhalte nicht, wo zu diesem Thema. Die Hilfe, die ich bisher gefunden habe, gibt mir nur entweder "Name nicht finden" oder "Modul nicht gefunden: Fehler: Kann 'fs' in" Fehler nicht auflösen.

Answer 1

Sie benötigen Typ für jasmin

npm i --save-dev @types/jasmine 

zu installieren und es dann in Ihrer TSconfig Datei erklären

"types": ["jasmine"]