[type]類型的參數不能分配給[type]類型的參數

Question

運行npx webpack時出現此錯誤

Version: webpack 3.12.0
Time: 57478ms
        Asset     Size  Chunks                    Chunk Names
       app.js   172 kB       0  [emitted]         app
    vendor.js  7.91 MB       1  [emitted]  [big]  vendor
   app.js.map   256 kB       0  [emitted]         app
vendor.js.map  9.28 MB       1  [emitted]         vendor
  [21] ./angular/service.ts 3.92 kB {0} [built]
  [23] ./angular/Utility.ts 2.21 kB {0} [built]
  [37] (webpack)/buildin/global.js 509 bytes {1} [built]
  [42] ./angular/component/empty.ts 1.35 kB {0} [built]
  [66] ./angular/api.ts 3.15 kB {0} [built]
  [85] ./angular/modules/LoadComponentModule.ts 1.92 kB {0} [built]
 [250] ./angular/bootstrap.ts 2.58 kB {0} [built]
 [251] ./angular/env.json 325 bytes {0} [built]
 [587] ./angular/ErrorCatcher.ts 2.57 kB {0} [built]
 [588] ./angular/modules/MaterialModules.ts 2.4 kB {0} [built]
 [589] ./angular/modules/AFModules.ts 1.17 kB {0} [built]
 [594] ./angular/Pipes.ts 5.64 kB {0} [built]
 [595] ./angular/component/layout.ts 2.52 kB {0} [built]
 [601] ./angular/component/management/wrapper.ts 3.91 kB {0} [built]
 [605] ./angular/component/project/project_list.ts 4.87 kB {0} [built]
    + 595 hidden modules

ERROR in ./angular/component/search.ts
[tsl] ERROR in D:\nodeapps\myproject\angular\component\search.ts(101,34)
      TS2345: Argument of type 'string' is not assignable to parameter of type 'CollectionReference'.

ERROR in ./angular/component/search.ts
[tsl] ERROR in D:\nodeapps\myproject\angular\component\search.ts(102,26)
      TS2345: Argument of type 'CollectionReference' is not assignable to parameter of type 'Query | CollectionReference'.
  Type 'firebase.firestore.CollectionReference' is not assignable to type 'FirebaseFirestore.CollectionReference'.
    Property 'offset' is missing in type 'CollectionReference'.

文件中的錯誤行是this.collectionPath和org ：

this.ref = this.afs.collection(this.collectionPath, org=>{
    var r = this.whereAll(org, this.requirementQuerys);
    this.params.forEach(p=>{
        r = this.whereAll(r, p.querys);
    });
    return this.orderBy ? r.orderBy(this.orderBy) : r;
});

這是我從package.json依賴項：

  "dependencies": {
    "firebase-admin": "^5.12.1",
    "firebase-functions": "^1.0.4",
    "firebase-tools": "^3.18.6"
  },
  "devDependencies": {
    "@angular/animations": "^5.2.5",
    "@angular/cdk": "^5.2.1",
    "@angular/cli": "^1.6.8",
    "@angular/common": "^5.2.5",
    "@angular/compiler": "^5.2.5",
    "@angular/core": "^5.2.5",
    "@angular/forms": "^5.2.5",
    "@angular/http": "^5.2.5",
    "@angular/material": "^5.2.1",
    "@angular/platform-browser": "^5.2.5",
    "@angular/platform-browser-dynamic": "^5.2.5",
    "@angular/router": "^5.2.5",
    "@google-cloud/functions-emulator": "^1.0.0-beta.4",
    "@types/hammerjs": "^2.0.35",
    "ajv": "^6.0.0",
    "angularfire2": "^5.0.0-rc.6",
    "concurrently": "^3.5.1",
    "es6-shim": "~0.35.3",
    "exports-loader": "~0.7.0",
    "expose-loader": "~0.7.4",
    "firebase": "^5.0.4",
    "glob": "^7.1.2",
    "hammerjs": "^2.0.8",
    "http-server": "^0.11.1",
    "imports-loader": "~0.7.1",
    "node-sass": "^4.7.2",
    "reflect-metadata": "~0.1.12",
    "rxjs": "^5.5.6",
    "ts-loader": "^3.5.0",
    "typescript": "^2.7.1",
    "webpack": "^3.11.0",
    "webpack-dev-server": "^2.11.1",
    "webpack-sources": "^1.1.0",
    "zone.js": "~0.8.20"
  },

這是我的webpack.config.js

require('./html_style');

const path = require('path');
const webpack = require('webpack');
const CommonsChunkPlugin = webpack.optimize.CommonsChunkPlugin;
const isVendor = function(module){return module.context && module.context.indexOf("node_modules") !== -1;};

module.exports = {
  devtool: 'source-map',
  watch: false,
  entry: {
    'app': './angular/bootstrap.ts'
  },
  output: {
    filename: '[name].js',
    path: path.resolve('./public/angular')
  },
  resolve: {
    extensions: ['.ts', '.tsx', '.js']
  },
  module: {
    exprContextCritical: false,
    loaders: [
      { test: /\.ts?$/, exclude: /node_modules/, loader: 'ts-loader' }
    ]
  },
  plugins: [
    new CommonsChunkPlugin({name: 'vendor', minChunks: isVendor})
  ]
}

我一直在谷歌搜索，但沒有運氣。 任何的想法？ 我的平台是Windows。 我的節點版本是10.9.0，npm版本是6.4.0。

Answer 1

您的問題與https://github.com/angular/angularfire2/issues/1467有些類似。 當您有angularfire2和firebase庫版本不匹配時會發生這種情況。 您的問題的解決方案是使用強大的打字。 我已經修改了你的代碼，所以你將有一個例子來解決你的問題：

import { AngularFirestore, Query, QueryFn } from 'angularfire2/firestore';

let query: QueryFn = org => {
    let r: Query = this.whereAll(org, this.requirementQuerys);
    this.params.forEach(p => {
        r = this.whereAll(r, p.querys);
    });
    return this.orderBy ? r.orderBy(this.orderBy) : r;
};
this.ref = this.afs.collection(this.collectionPath, query);

如果你還有問題我會使用"angularfire2": "^5.0.0-rc.12"和"firebase": "^5.4.0" "angularfire2": "^5.0.0-rc.12" "firebase": "^5.4.0" 。 在將來看看angularfire2 github問題，以解釋哪些版本兼容，如果在下次更新依賴項后你的項目不起作用。

Answer 2

認為這一行暗示了主要問題： Type 'firebase.firestore.CollectionReference' is not assignable to type 'FirebaseFirestore.CollectionReference'. 顯然有兩個不同的CollectionReference類。 一個位於firbase.firestore，另一個位於FirebaseFireStore。 那么你的導入可能錯了嗎？