I have my webpack.config.js like this.
var HtmlWebpackPlugin = require("html-webpack-plugin"); module.exports = { entry: "./source/application/main.ts", output: { path: "./distribution", filename: "app.bundle.js" }, module: { loaders: [{ test: /\.ts$/, loader: "ts-loader" }] }, plugins: [new HtmlWebpackPlugin({ template: "./source/index.html" })], resolve: ["", ".js", ".ts"] } It finds and interprets the file main.ts properly, except when bootstraping the module (third line below), it says that the file can't be resolved. This is my main.ts file.
import { platformBrowserDynamic } from "@angular/platform-browser-dynamic"; import { AppModule } from "./app.module"; platformBrowserDynamic().bootstrapModule(AppModule); The file that it can't resolve is there. If I change its name or remove it, my IDE tells that it's missing. However, for some reason, when bootstraping the process, the computer can't find it.
ERROR in ./application/main.ts
Module not found: Error: Cannot resolve 'file' or 'directory' ./app.module in C:...\main
@ ./application/main.ts 3:19-42 webpack: bundle is now VALID.
The contents of the app.module.ts and main.ts were brought from Angular.IO page.
I've seen some posts saying that it's because config.json not being valid and/or possibly some confusion on paths in Windows. However, I've verified that the file is valid and I've tried adding context:require("path").resolve(__dirname, "app"), to my Webpack config. It only resulted in not finding even the former file app.ts, so I disregarded that approach.
I've spend a number of days trying to make it work and I'm out of ammo. How can I even troubleshoot it?
1 Answers
Answers 1
You have invalid file extension configuration in your webpack.config.js - instead of
resolve: ["", ".js", ".ts"] you should have
resolve: { extensions: ["", ".js", ".ts"] } Edit:
If you need to target webpack2,in your case the migration would be pretty painless - its only needed to remove "" from extensions:
resolve: { extensions: [".js", ".ts"] } 
0 comments:
Post a Comment