I just updated my Angular 2 project to work with Webpack 2 which is working just fine. However, i'm facing a new problem when using the resolve: { alias: {...} }
key.
When i used webpack 1, this code just worked fine:
webpack.config.js
resolve: {
// http://webpack.github.io/docs/configuration.html#resolve-extensions
extensions: ['.ts', '.js', '.json', '.css', '.html'],
alias: {
"orion/editor/edit": "http://www.eclipse.org/orion/editor/releases/current/built-editor.min.js"
}
},
angular component:
ngOnInit() {
Promise.all([
require('http://www.eclipse.org/orion/editor/releases/current/built-editor.min.js'),
require('http://eclipse.org/orion/editor/releases/current/built-editor.css')
]).then(function () {
requirejs(['orion/editor/edit'], function (edit: any) {
this.orionEditor = edit({className: 'editor', parent: 'xml'})[0];
this.receiveXmlData();
}.bind(this));
}.bind(this));
}
Now when using webpack 2, i always get an error that both files cannot be resolved. Does anyone have an idea?
Module not found: Error: Can't resolve 'http://eclipse.org/orion/editor/releases/current/built-editor.css' in [Angular-component file]
Module not found: Error: Can't resolve 'http://www.eclipse.org/orion/editor/releases/current/built-editor.min.js' in 'C:\Applications\winery\enpro-winery\org.eclipse.winery.ui\src\app\instance\editXML'
My try up till now:
in the webpack.common.js for webpack2 i tried:
const path = require('path');
resolve: {
extensions: ['.ts', '.js', '.json', '.css', '.html'],
alias: {
"orion/editor/edit": path.resolve("http://www.eclipse.org/orion/editor/releases/current/built-editor.min.js")
}
and
resolve: {
extensions: ['.ts', '.js', '.json', '.css', '.html'],
modules: [
path.join(__dirname, "src"),
"node_modules",
path.resolve("http://www.eclipse.org/orion/editor/releases/current/built-editor.min.js"),
path.resolve("http://eclipse.org/orion/editor/releases/current/built-editor.css")
]
},
Actually, I found the solution: I accidentally removed the resolve-url-loader
dependency from my package.json.
I further found that I don't even need to include the alias
or path.resolve
in the resolve object.