Webpack2/awesome-typescript Loader scheint nicht zu kompilieren

Meine aktuelle Webpack-Setup hat ein Problem irgendwo .. und ich kann es nicht finden. Ich benutze Angular2 + Webpack2 + AwesomeTypescriptLoader. App läuft und läuft, aber Webpack kompiliert meine App nicht richtig. Jedes Mal, wenn ich eine ts-Datei in meinem Projekt ändern bekomme ichWebpack2/awesome-typescript Loader scheint nicht zu kompilieren

[at-loader] Überprüfung in einem separaten Prozess gestartet ...

[at-loader] Ok, 0,985 sec.

so scheint es die Änderung zu erkennen, aber meine Bundles/Js-Ausgabedatei werden nie aktualisiert. In dem Moment, in dem ich TSC-W im Hintergrund laufen lasse, funktioniert alles. Aber das sollte nicht nötig sein, oder?

Kann jemand meinen Fehler finden? Vielen Dank!

Hier sind meine Config-Dateien:

TSconfig:

{ 
    "compilerOptions": { 
    //"inlineSourceMap": true, 
    //"inlineSources": true, 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "target": "es5", 
    "sourceMap": true, 
    "rootDir": ".", 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": true, 
    "noImplicitAny": false 
    }, 
    "exclude": [ 
    "bin", 
    "node_modules", 
    "wwwroot/dist" 
    ] 
}

webpack:

"use strict"; 
var webpack = require('webpack'); 
var HtmlWebpackPlugin = require('html-webpack-plugin'); 
var path = require('path'); 
var CleanWebpackPlugin = require('clean-webpack-plugin'); 

module.exports = { 
    entry: { 
     "polyfills": path.resolve("./wwwroot/app/base/polyfills.ts"), 
     "app": path.resolve("./wwwroot/app/base/main.ts"), 
     "vendor": path.resolve("./wwwroot/app/base/vendors.ts") 
    }, 
    devtool: 'source-map', 

    output: { 
     filename: "[name].bundle.js", 
     chunkFilename: "[id].chunk.js", 
     path: "./wwwroot/dist/", 
     publicPath: "./dist/" 
    }, 
    watch: true, 
    resolve: { 
     extensions: ['', '.js', '.ts', '.html'] 
    }, 
    module: { 
     loaders: [ 
      //Typescript 
      { 
       test: /\.tsx?$/, 
       loaders: ['angular2-template-loader', 'awesome-typescript-loader'] 
      }, 
      // SASS 
      { 
       test: /\.scss$/, 
       loaders: ['style', 'css', 'sass'], 
       exclude: '/node_modules/' 
      }, 
      { 
       test: /\.html$/, 
       loaders: ['raw-loader'], 
       exclude: "./wwwroot/index.html" 
      }, 
      // Fonts & Files 
      { 
       test: /\.(ttf|eot|txt|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/, 
       loader: 'file-loader', 
       exclude: '/node_modules/' 
      } 
     ] 
    }, 
    noParse: [/moment.js/], 

    plugins: [ 
     //new webpack.OldWatchingPlugin(), 
     // new webpack.optimize.UglifyJsPlugin({ 
     // compressor: { 
     //  warnings: false 
     // } 
     // }), 

     new webpack.ProvidePlugin({ 
      $: "jquery", 
      jQuery: "jquery" 
     }), 
     new webpack.optimize.CommonsChunkPlugin({ 
      name: ["app", "vendor", "polyfills"] 
     }), 

     new HtmlWebpackPlugin({ 
      template: './wwwroot/index.html' 
     }) 
    ] 
};

Und die Versionen Ich verwende:

{ 
    "version": "0.0.1", 
    "name": "someapp", 
    "private": true, 
    "dependencies": { 
    "@angular/common": "2.4.0", 
    "@angular/compiler": "2.4.0", 
    "@angular/core": "2.4.0", 
    "@angular/forms": "2.4.0", 
    "@angular/http": "2.4.0", 
    "@angular/material": "2.0.0-beta.1", 
    "@angular/platform-browser": "2.4.0", 
    "@angular/platform-browser-dynamic": "2.4.0", 
    "@angular/router": "3.4.0", 
    "@types/hammerjs": "^2.0.34", 
    "@types/lodash": "^4.14.34", 
    "angular2-color-picker": "^1.3.0", 
    "core-js": "^2.4.1", 
    "html-webpack-plugin": "^2.16.2", 
    "jquery": "^2.2.0", 
    "lodash": "^4.15.0", 
    "moment": "^2.14.1", 
    "reflect-metadata": "^0.1.3", 
    "rxjs": "5.0.1", 
    "tablesorter": "2.25.5", 
    "webpack": "1.13.2", 
    "zone.js": "0.7.2" 
    }, 
    "devDependencies": { 
    "angular2-template-loader": "^0.5.0", 
    "awesome-typescript-loader": "3.0.0-beta.17", 
    "raw-loader": "^0.5.1", 
    "clean-webpack-plugin": "^0.1.9", 
    "css-loader": "^0.23.1", 
    "html-loader": "^0.4.3", 
    "node-sass": "^4.1.1", 
    "sass-loader": "^4.1.1", 
    "style-loader": "^0.13.1", 
    "typescript": "2.0.10", 
    "typings": "1.3.3" 
    } 
}

EDIT: Es ist die Gleiches gilt für Webpack 2.2.0-rc.4 btw.

Quelle

2017-01-06 Mr. Muh

Siehe awesome-typescript-loader und angular2-template-loader.

loaders: [ 
    { 
     test: /\.ts$/, 
     loaders: ['awesome-typescript-loader', 'angular2-template-loader'], 
     exclude: [/\.(spec|e2e)\.ts$/] 
    }, 
    ... 
]

Versuchen Sie, 'awesome-typescript-loader' nach vorne zu bewegen. Wenn das nicht funktioniert, kann es bei der Konfiguration Ihres Web-Packs zu weiteren kleineren Problemen kommen. Ich hoffe, das hilft. Ich habe auch Probleme mit dieser Datei und es kann sehr ärgerlich sein, Lösungen zu finden online ...

Quelle

2017-01-09 22:12:27 Kody

auch Entschlossenheit enthält '.ts', aber nicht' .tsx‘. Beide Beispiele haben ".ts", ".tsx", ".js", ".jsx". – Kody

Das ändert nichts :(. Ich bekomme immer noch die Meldung, dass AT-Loader meine Änderung zu erkennen scheint ('[at-loader] Überprüfung wurde in einem separaten Prozess gestartet ... & [at-loader] Ok, 0,985 sec.) aber mein Paket scheint nicht aktualisiert zu werden :( –

Ah, okay. Ich kann nur an diesem Punkt erraten, es ist eine kleine Diskrepanz. Etwas anderes, das du versuchen könntest, ist, den Beispielen zu folgen, die ich aufgelistet habe, und ein blankes Projekt zu erhalten Wie du es erwartest, dann migriere diese Änderungen in deine App. Verwerfe die Versionen deiner App und füge nur das zurück, was du brauchst. – Kody

-2

Ich hatte das gleiche Problem und löste es, wenn ich resolve Erweiterungen in webpack.config.js von geändert:

resolve: { 
    extensions: ['', '.js', '.ts'] 
},

zu:

resolve: { 
    extensions: ['', '.ts', '.tsx', '.js', '.jsx'] 
},

Quelle

2017-01-30 00:49:02 Milos

Webpack2/awesome-typescript Loader scheint nicht zu kompilieren

Antwort

Verwandte Themen