javascript - 获取结果无法从 Webpack 获取 /
问题描述
我正在尝试webpack
使用我的 React 项目运行,但是当我使用推荐运行我的项目时,webpack-dev-serve
我得到了错误:
Cannot GET /
我尝试查看http://localhost:8080/webpack-dev-serve
以检查构建的路由是否不正确,但我没有发现问题。
有人可以帮我解决这个问题吗?我正在四处寻找几个小时
webpack.config.js
const path = require('path')
const htmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
entry: './src/index.tsx',
devtool: 'eval-source-map',
resolve: {
extensions: ['.tsx', '.ts', '.js'],
},
module: {
rules:[
{
test: /\.(ts|js)x?$/,
exclude: /node_modules/,
use: [
{
loader:'babel-loader',
},
],
include:[path.resolve(__dirname, 'src')],
},{
test: /\.css$/,
use:['style-loader', 'css-loader'],
include:[path.resolve(__dirname, 'src')],
},{
test: /\.(?:ico|gif|png|jpg|jpeg)$/i,
type:'asset/resource',
include:[path.resolve(__dirname, 'src')],
},
],
},
output: {
publicPath: '/build/',
filename: 'bundle.js',
path: path.resolve(__dirname, '/build/'),
},
mode: 'development',
plugins: [
new htmlWebpackPlugin({
template: path.resolve(__dirname, 'build', 'index.html')
}),
],
}
包.json
{
"name": "react-shopping-bag",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"serve": "webpack-dev-server",
"build": "webpack",
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@babel/core": "^7.15.8",
"@babel/plugin-transform-runtime": "^7.15.8",
"@babel/preset-env": "^7.15.8",
"@babel/preset-react": "^7.14.5",
"@babel/preset-typescript": "^7.15.0",
"@types/react": "^17.0.32",
"@types/react-dom": "^17.0.10",
"babel-loader": "^8.2.3",
"css-loader": "^6.4.0",
"html-webpack-plugin": "^5.4.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"style-loader": "^3.3.1",
"typescript": "^4.4.4",
"webpack": "^5.59.1",
"webpack-cli": "^4.9.1",
"webpack-dev-server": "^4.3.1"
}
}
http://localhost:8080/webpack-dev-server
http://localhost:8080/build/bundle.js
解决方案
推荐阅读
- docker - 如何使用 Kubernetes 代理访问 SonarQube?
- android - 场景形式碰撞
- c++ - _tcsstr 的标头
- tensorflow - TensorFlow 无法识别的参数 \\
- javascript - 识别相同的“手气”搜索
- javascript - 检测单击当前活动的选项卡。(角材料选项卡)
- android - 与在 AndroidManifest.xml [Ionic 3] 中声明的元素重复
- r - 如何在 R 中有效地请求栅格堆栈的一部分
- r - 如何删除数据框中的列的重复项,该列是 R 中的字符?
- sql-server - SQL Server CTE 左外连接