无法解析在typescript/webpack中找不到'rxjs'模块

Question

我在将rxjs加载到简单的webpack安装程序（无角）时遇到问题。我正在运行：

./node_modules/.bin/webpack --config webpack.config.js --watch 

启动webpack。与应用程序，src/app.ts，唯一的文件的开头为：

import { Observable } from 'rxjs'; 

和这条线在VSCode和的WebPack控制台与此错误强调：

Cannot find module 'rxjs'. 

但整体输出工作正常。只是这个控制台错误。

tsconfig.json：

{ 
    "compilerOptions": { 
     "target": "es2015" 
    }, 
    "files": [ 
     "src/app.ts" 
    ] 
} 

webpack.config.js：

module.exports = { 
    entry: "./src/app.ts", 
    output: { 
     filename: "dist/bundle.js" 
    }, 
    resolve: { 
     // Add '.ts' and '.tsx' as a resolvable extension. 
     extensions: [".webpack.js", ".web.js", ".ts", ".tsx", ".js"] 
    }, 
    module: { 
     loaders: [ 
      // all files with a '.ts' or '.tsx' extension will be handled by 'ts-loader' 
      { test: /\.ts?$/, loader: "ts-loader" } 
     ] 
    } 
} 

package.json（正确安装的所有内容）：

{ 
    "scripts": { 
    "start": "./node_modules/.bin/webpack --config webpack.config.js --watch" 
    }, 
    "devDependencies": { 
    "ts-loader": "^2.1.0", 
    "typescript": "^2.3.4", 
    "webpack": "^2.6.1", 
    "webpack-dev-server": "^2.4.5" 
    }, 
    "dependencies": { 
    "bootstrap": "^3.3.7", 
    "rxjs": "^5.4.0" 
    } 
} 

我找不到理由为什么不能TS/webpack解析在哪里是rxjs

Answer 1

您必须添加node_modules到您的WebPack resolve.modules配置：

resolve: { 
    modules: [ 
     "node_modules", 
     path.resolve(__dirname, "app") 
    ], 
    extensions: [".js", ".json", ".jsx", ".css"], 
} 

更多信息上https://webpack.js.org/configuration/resolve/

Answer 2

你应该从经典更改默认模块分辨率的战略节点。为了做到这一点，改变你的tsconfig.json文件：

{ 
    ... 
    "compilerOptions": { 
     .... 
     "moduleResolution": "node" 
    } 
} 

见有关Module Resolution