【问题标题】:webpack can't find src, but it shouldn't be looking for itwebpack找不到src,但它不应该在寻找它
【发布时间】:2018-12-04 07:46:35
【问题描述】:

我正在尝试了解如何将 typescript 与 React 一起使用。我正在浏览本教程:https://blog.logrocket.com/how-why-a-guide-to-using-typescript-with-react-fffb76c61614

当我通过下面在我的package.json 中定义的 npm 脚本“pile”运行 webpack 命令时,我得到:ERROR in Entry module not found: Error: Can't resolve './src' in '/my/home/directory/projects/tsx-tutorial'

这是我的项目文件夹的目录结构:

tsx-tutorial
├── app.tsx {<---- I want this to be my entry point right?}
├── dist
├── index.html
├── index.ts
├── lookTree.txt
├── node_modules.zip
├── package-lock.json
├── package.json
├── src {<----- there it is??}
│   └── hello.ts
├── tsconfig.json
└── webpack.config.js

2 directories, 10 files

这是我的webpack.config.js

var path = require("path");
var config = {
  entry: "app.tsx", // I'm not doing anything with ./src at all here??
  output: {
    path: path.resolve(__dirname, "build"),
    filename: "bundle.js"
  },
  resolve: {
    extensions: [".ts", ".tsx", ".js"]
  },
  module: {
    loaders: [
      {
        test: /\.tsx?$/,
        loader: "ts-loader",
        exclude: /node_modules/
      }
    ]
  }
};

我没有要求任何带有“src”的东西,句号 - 为什么它看起来在那里?我觉得我错过了一些非常基本的东西。

最后是package.json:

{
  "name": "tsx-tutorial",
  "version": "0.0.1",
  "description": "to help me learn tsx-fu",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "pile": "webpack"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "ts-loader": "^4.4.1",
    "webpack": "^4.12.1",
    "webpack-cli": "^3.0.8"
  },
  "dependencies": {
    "@types/react": "^16.4.1",
    "@types/react-dom": "^16.0.6",
    "react": "^16.4.1",
    "react-dom": "^16.4.1"
  }
}

非常感谢您的帮助!感谢您帮助新手学习。

【问题讨论】:

  • 你试过entry: "./app.tsx"吗?
  • 尝试强制 webpack 也查看你的配置文件,也使用 Tholle 所说的。运行webpack --config ./webpack.config.js 明确表示。
  • 我还找到了一个更好的教程,以防人们稍后看到:typescriptlang.org/docs/handbook/react-&-webpack.html

标签: typescript npm webpack tsx


【解决方案1】:

虽然它看起来就像你给了它一个配置,但文件需要在底部导出它才能让 webpack 看到它。

module.exports = config

解释错误:从版本 4 开始,如果未指定配置,webpack 默认使用 ./src 作为入口点。 ./src./src/index.js 的作用相同,因为模块解析是如何工作的,但是文件名和扩展名是可配置的。

【讨论】:

  • 这绝对是它!事后看来,这很明显——如果它是一个 .js 文件,就没有其他办法了。
猜你喜欢
  • 1970-01-01
  • 2015-10-17
  • 2012-06-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-08-25
  • 1970-01-01
相关资源
最近更新 更多