在本地运行我创建的不使用 angular-cli 的 node.js-angular7-webpack4.21 应用程序时,我的浏览器出现以下错误:
Error: Can't resolve all parameters for Location: (?).
我已经对这个问题进行了广泛的研究。首先,我没有任何组件、服务或其他名为“位置”的名称,所以我不知道编译器很难解析哪个实体的参数。其次,我的整个应用程序中只有 4 个服务,没有一个指向彼此,所以这不是循环依赖问题。我也没有忘记将“@Injectable()”装饰器正确地放入任一服务文件中。真的,经过三次和八次检查后,这不是问题。
此外,我用一个空的 angular6 项目重现了这个问题,该项目由 0 个服务和只有 1 个组件组成,其模板中的 div 中只有单词,在这种情况下,我只得到关于“ApplicationModule”而不是“Location”的相同错误'.所以即使我没有 webpack 错误,我假设问题出在我的 webpack 配置中,因此我将在下面放置 webpack.config.js 和 tsconfig.js 文件,希望有人能找到关于它们的一些非常愚蠢的东西。
这是我的 tsconfig.json:
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "es2017", "es5", "es6", "es7"],
"outDir": "dist",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": true,
"noImplicitAny": false,
"typeRoots": ["types"],
"types": ["node"]
},
"exclude": ["node_modules"]
}
这是我的 webpack.config.js:
var webpack = require('webpack');
var helpers = require('./helpers');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const path = require('path'); // needed ?
module.exports = {
mode: 'development',
devtool: 'source-map',
entry: {
'main': helpers.root('app/main.ts'),
'vendor': helpers.root('vendor.ts'),
'polyfills': helpers.root('polyfills.ts')
},
output: {
path: helpers.root('dist'),
filename: '[name].js'
},
resolve: {
extensions: ['.ts', '.js']
},
module: {
rules: [{
test: /\.ts$/,
use: [{
loader: 'awesome-typescript-loader',
options: {
configFileName: helpers.root('tsconfig.json')
}
}, 'angular2-template-loader?keepUrl=true']
},
{
test: /\.html$/,
use: 'html-loader'
},
{
test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
use: 'file-loader?name=assets/[name].[hash].[ext]'
},
{
test: /\.css$/,
use: [
// 'style-loader',
MiniCssExtractPlugin.loader,
// 'to-string-loader',
'css-loader'
],
exclude: [helpers.root('stylesheets')]
},
{
test: /\.css$/,
use: 'raw-loader',
include: [helpers.root('stylesheets')]
}
]
},
plugins: [
new HtmlWebpackPlugin({
template: 'index.html'
}),
new MiniCssExtractPlugin({
// Options similar to the same options in webpackOptions.output
// both options are optional
filename: "[name].css",
chunkFilename: "main.css"
}),
new webpack.ContextReplacementPlugin(
// The (\\|\/) piece accounts for path separators in *nix and Windows
// For Angular 5, see also https://github.com/angular/angular/issues/20357#issuecomment-343683491
/\@angular(\\|\/)core(\\|\/)fesm5/,
helpers.root('app'), // location of your src
{
// your Angular Async Route paths relative to this root drectory
}
)
]
};
谢谢你们。
最佳答案
我在将 Angular 6.1.10
升级到 7.0.6
和 webpack 4.19.1
时遇到了这个问题。
我做了一些更改,如 this 中所述回答并且有效。简而言之:
添加到您的 polyfill.ts
import 'core-js/es7/reflect';
希望对您有所帮助。
关于angular - 错误 : Can't resolve all parameters for Location: (? ) 在 angular7 webpack 应用程序中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52905498/