Question

背景：我从ASP.NET Core example of SignalR and webpack（对我来说很好）开始。我的目标是使用this TypeScript library对服务器端权威的多人游戏进行客户端插值。

我认为该问题与Webpack有关的原因是VisualStudio对box2d.ts库具有智能感知，并且tsc单独运行时未报告任何错误。

这是我的第一个使用webpack和TypeScript的项目，如果我错过了一些明显的内容，因此深表歉意。

webpack报告的错误：

ERROR in ./src/index.ts
Module not found: Error: Can't resolve 'Box2D' in 
'C:\Users\nathan.b\Desktop\Gamey\Gamey\src'
 @ ./src/index.ts 2:0-31 3:14-26

更新：详细输出错误：

ERROR in ./src/index.ts
Module not found: Error: Can't resolve 'Box2D' in 'C:\Users\nathan.b\Desktop\Gamey\Gamey\src'
resolve 'Box2D' in 'C:\Users\nathan.b\Desktop\Gamey\Gamey\src'
  Parsed request is a module
  using description file: C:\Users\nathan.b\Desktop\Gamey\Gamey\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
    resolve as module
      C:\Users\nathan.b\Desktop\Gamey\Gamey\src\src doesn't exist or is not a directory
      C:\Users\nathan.b\Desktop\Gamey\Gamey\src\node_modules doesn't exist or is not a directory
      C:\Users\nathan.b\Desktop\Gamey\src doesn't exist or is not a directory
      C:\Users\nathan.b\Desktop\Gamey\node_modules doesn't exist or is not a directory
      C:\Users\nathan.b\Desktop\src doesn't exist or is not a directory
      C:\Users\nathan.b\Desktop\node_modules doesn't exist or is not a directory
      C:\Users\nathan.b\src doesn't exist or is not a directory
      C:\Users\nathan.b\node_modules doesn't exist or is not a directory
      C:\Users\src doesn't exist or is not a directory
      C:\Users\node_modules doesn't exist or is not a directory
      C:\src doesn't exist or is not a directory
      C:\node_modules doesn't exist or is not a directory
      looking for modules in C:\Users\nathan.b\Desktop\Gamey\Gamey\src
        using description file: C:\Users\nathan.b\Desktop\Gamey\Gamey\package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
      looking for modules in C:\Users\nathan.b\Desktop\Gamey\Gamey\node_modules
        using description file: C:\Users\nathan.b\Desktop\Gamey\Gamey\package.json (relative path: ./node_modules)
          Field 'browser' doesn't contain a valid alias configuration
          using description file: C:\Users\nathan.b\Desktop\Gamey\Gamey\package.json (relative path: ./src/Box2D)
            no extension
              Field 'browser' doesn't contain a valid alias configuration
          using description file: C:\Users\nathan.b\Desktop\Gamey\Gamey\package.json (relative path: ./node_modules/Box2D)
            no extension
              Field 'browser' doesn't contain a valid alias configuration
              C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D is not a file
            .js
              Field 'browser' doesn't contain a valid alias configuration
              C:\Users\nathan.b\Desktop\Gamey\Gamey\node_modules\Box2D doesn't exist
            .js
              Field 'browser' doesn't contain a valid alias configuration
              C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D.js doesn't exist
            .ts
              Field 'browser' doesn't contain a valid alias configuration
              C:\Users\nathan.b\Desktop\Gamey\Gamey\node_modules\Box2D.js doesn't exist
            .ts
              Field 'browser' doesn't contain a valid alias configuration
              C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D.ts doesn't exist
              C:\Users\nathan.b\Desktop\Gamey\Gamey\node_modules\Box2D.ts doesn't exist
            as directory
              C:\Users\nathan.b\Desktop\Gamey\Gamey\node_modules\Box2D doesn't exist
            as directory
              existing directory
                using path: C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D\index
                  using description file: C:\Users\nathan.b\Desktop\Gamey\Gamey\package.json (relative path: ./src/Box2D/index)
                    no extension
                      Field 'browser' doesn't contain a valid alias configuration
                      C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D\index doesn't exist
                    .js
                      Field 'browser' doesn't contain a valid alias configuration
                      C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D\index.js doesn't exist
                    .ts
                      Field 'browser' doesn't contain a valid alias configuration
                      C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D\index.ts doesn't exist
[C:\Users\nathan.b\Desktop\Gamey\Gamey\src\src]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\src\node_modules]
[C:\Users\nathan.b\Desktop\Gamey\src]
[C:\Users\nathan.b\Desktop\Gamey\node_modules]
[C:\Users\nathan.b\Desktop\src]
[C:\Users\nathan.b\Desktop\node_modules]
[C:\Users\nathan.b\src]
[C:\Users\nathan.b\node_modules]
[C:\Users\src]
[C:\Users\node_modules]
[C:\src]
[C:\node_modules]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\node_modules\Box2D]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D.js]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\node_modules\Box2D.js]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D.ts]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\node_modules\Box2D.ts]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D\index]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D\index.js]
[C:\Users\nathan.b\Desktop\Gamey\Gamey\src\Box2D\index.ts]
 @ ./src/index.ts 2:0-31 3:14-26

index.ts：
足以确保没有任何内容被编译出来。

import * as signalR from "@aspnet/signalr";
import * as box2d from "Box2D";

const g: box2d.b2Vec2 = new box2d.b2Vec2(0, -10)
console.log(g);

const connection = new signalR.HubConnectionBuilder()
    .withUrl("/hub")
    .build();

tsconfig.json：

{
  "compilerOptions": {
    "target": "es6",
    "moduleResolution": "node",
    "baseUrl": ".",
    "paths": {
      "Box2D": [ "./Box2D/Box2D" ]
    }
  }
}

webpack.config.js：

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const CleanWebpackPlugin = require("clean-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
    entry: "./src/index.ts",
    output: {
        path: path.resolve(__dirname, "wwwroot"),
        filename: "[name].[chunkhash].js",
        publicPath: "/"
    },
    resolve: {
        extensions: [".js", ".ts"]
    },
    module: {
        rules: [
            {
                test: /\.ts$/,
                use: "ts-loader"
            },
            {
                test: /\.css$/,
                use: [MiniCssExtractPlugin.loader, "css-loader"]
            }
        ]
    },
    plugins: [
        new CleanWebpackPlugin(["wwwroot/*"]),
        new HtmlWebpackPlugin({
            template: "./src/index.html"
        }),
        new MiniCssExtractPlugin({
            filename: "css/[name].[chunkhash].css"
        })
    ]
};

项目结构：

Answer 1

所以我终于开始工作了。我必须明确引用Box2D库路径。没有glob变体有效（/ *或** / *），但也许我在那里缺少某些东西。

更改：

head(data1)
month     year impressions clicks conversions    cost revenue month_num
<chr>    <dbl>       <int>  <int>       <int>   <dbl>   <dbl>     <dbl>
1 April     2018    18737558 107063         291 117505. 145745.         4
2 August    2018    23247068 126523         439 118631. 143217.         8
3 February  2018    20119465 117370         320 146965. 114594.         2
4 January   2018    23905450 148205         382 155756. 145513.         1
5 July      2018    11963956  92740         297 106249. 138354.         7
6 June      2018     6845841  52294         253  53205.  91740.         6

Answer 2

After reading up on webpack module resolution，另一种解决方案是从模块引用切换为绝对或相对路径引用。

更改：
tsconfig.json：

{
  "compilerOptions": {
    "target": "es6",
    "moduleResolution": "node",
    "baseUrl": "..",
    "paths": {
      "Box2D": [ "./src/Box2D/Box2D" ]
    }
  }
}

webpack.config.js：
与问题中的内容相同-无需修改。

index.ts：

import * as box2d from "./Box2D/Box2D";

Webpack无法找到TypeScript（显然）找到的导入

2 个答案: