绝对打字稿文件导入错误

时间:2019-12-24 11:10:05

标签: reactjs typescript webpack

我刚刚安装了TSLint,并带有几个推荐的扩展。这些警告我将以前的相对文件导入重构为绝对导入。但是,现在我收到所有文件导入错误。在下面,我将在我的React应用程序的组件树顶部显示这些内容:

reactclient        | ERROR in ./src/index.tsx
reactclient        | Module not found: Error: Can't resolve 'components/Root/Root' in '/app/src'
reactclient        |  @ ./src/index.tsx 1:0-40 8:23-27
reactclient        |  @ multi @babel/polyfill ./src
reactclient        |
reactclient        | ERROR in ./src/index.tsx
reactclient        | Module not found: Error: Can't resolve 'configureStore' in '/app/src'
reactclient        |  @ ./src/index.tsx 2:0-48 7:9-23
reactclient        |  @ multi @babel/polyfill ./src
reactclient        | Child html-webpack-plugin for "index.html":
reactclient        |      1 asset
reactclient        |     Entrypoint undefined = index.html
reactclient        |     [./node_modules/html-webpack-plugin/lib/loader.js!./public/index.html] 1.23 KiB {0} [built]
reactclient        |     [./node_modules/lodash/lodash.js] 528 KiB {0} [built]
reactclient        |     [./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 472 bytes {0} [built]
reactclient        |     [./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {0} [built]
reactclient        | ℹ 「wdm」: Failed to compile.

我在容器中运行该应用程序。当我在外壳中打开容器时,可以看到文件确实存在于正确的位置。我怀疑我的webpack配置中一定也必须更新一些配置。以下是我的webpack.config.js:

const appPath = path.resolve(__dirname, "src/")

module.exports = function(env, argv) {
    const envIsProduction = argv.mode === "production" ? true : false

    return {
        // Entry point of the application. The babel polyfill is applied to the output bundle for ES6+ feature support
        entry: ["@babel/polyfill", appPath],
        output: {
            publicPath: "/",
            filename: "bundle.js"
        },
        // Build mode
        mode: envIsProduction ? "production" : "development",
        resolve: {
            extensions: [".ts", ".tsx", ".js"],
            alias: {
                "@images": path.resolve(__dirname, "public/images"),
                "@icons": path.resolve(__dirname, "public/icons"),
                "@components": path.join(appPath, "components"),
                "@utils": path.join(appPath, "utils")
            }
        },
    ...

有人知道如何解决此问题吗?我一直在寻找解决方案。多数人把我指向更新到index.tsx文件的条目。但是,这没什么区别。

0 个答案:

没有答案