javascript - webpack - 找不到 manifest.json-6ren

javascript - webpack - 找不到 manifest.json

转载作者：行者123 更新时间：2023-12-05 04:40:53

27

4

我正在使用 React 进行网站开发。
运行应用程序时出错。

我检查了 Inspector 中的 Sources，有一个 manifest.json 但显示错误。

文件夹结构:

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta
      name="description"
      content="Web site created using create-react-app"
    />
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
    <!--
      manifest.json provides metadata used when your web app is installed on a
      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
    -->
    <link rel="manifest" href="manifest.json" />
    <title>React App</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
  </body>
</html>

list .json

{
  "short_name": "React App",
  "name": "Create React App Sample",
  "icons": [
    {
      "src": "favicon.ico",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    },
    {
      "src": "logo192.png",
      "type": "image/png",
      "sizes": "192x192"
    },
    {
      "src": "logo512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ],
  "start_url": ".",
  "display": "standalone",
  "theme_color": "#000000",
  "background_color": "#ffffff"
}

webpack/webpack.base.js

const webpack = require("webpack");

const utils = require("./utils");

const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
  entry: "./src/index.jsx",
  resolve: {
    alias: {
      "@": utils.resolve("src")
    },
    extensions: ["*", ".js", ".jsx"]
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      },
      {
        test: /\.(png|jpg|gif|svg)$/i,
        type: "asset",
        parser: {
          dataUrlCondition: {
            maxSize: 8192
          }
        }
      },
      {
        test: /\.(ico|json)$/,
        exclude: /node_modules/,
        use: ["file-loader?name=[name].[ext]"] // ?name=[name].[ext] is only necessary to preserve the original file name
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: "public/index.html",
      filename: "index.html",
      inject: true,
      favicon: "public/favicon.ico",
      manifest: "public/manifest.json",
    })
  ]
};

webpack/webpack.dev.js

const { merge } = require("webpack-merge");
const base = require("./webpack.base");

const Dotenv = require("dotenv-webpack");

module.exports = merge(base, {
  mode: "development",
  devtool: "inline-source-map",
  output: {
    publicPath: "/"
  },
  devServer: {
    port: 3030,
    static: true,
    static: "dist"
  },
  plugins: [new Dotenv({ path: "./.env.development" })]
});

webpack/utils.js

const path = require("path");

module.exports = {
  resolve: function (dir) {
    return path.join(__dirname, "..", dir);
  }
};

最佳答案

根据您的文件结构和 webpack 配置，您的 list 位于 public/ 目录中，但未被引用。 https://webpack.js.org/configuration/dev-server/#directory

您可能希望将您的配置更改为类似—

  devServer: {
    port: 3030,
    static: [
      { directory: utils.resolve("dist") },
      { directory: utils.resolve("public") },
    ]
  },

FWIW，webpack/utils.js 文件似乎是多余的 - Path.resolve() 正是这样做的。

关于javascript - webpack - 找不到 manifest.json，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/70178726/

27

4

0

文章推荐：缩放父级时节点之间的 JavaFX 背景可见

grails - Cereal ，哥伦。按 parent 找 child ，按 child 找 parent
例如，我有一个父类Author: class Author { String name static hasMany = [ fiction: Book,
javascript - DOJO:找 child
代码如下: dojo.query(subNav.navClass).forEach(function(node, index, arr){ if(dojo.style(node, 'd
mysql - 加入两张 table 找 friend
我有一个带有 Id 和姓名的学生表和一个带有 Id 和 friend Id 的 Friends 表。我想加入这两个表并找到学生的 friend 。例如，Ashley 的 friend 是 Saman
grails - Grails按 child 找 parent
我通过互联网浏览，但仍未找到问题的答案。应该很容易: class Parent { String name Child child } 当我有一个 child 对象时，如何获得它的 paren
android - Firebase Android 找 friend 功能
我正在尝试创建一个以 Firebase 作为我的后端的社交应用。现在我正面临如何(在哪里？)找到 friend 功能的问题。我有每个用户的邮件地址。我可以访问用户的电话也预订。在传统的后端中，我
ios - Apple Game Center 和 Facebook 找 friend iOS6
我主要想澄清以下几点: 1。有人告诉我，在 iOS 5 及以下版本中，如果您使用 Game Center 设置多人游戏，则“查找 Facebook 好友”(如与好友争夺战)的功能不是内置的，因此您需要
docker - 有什么用!意思？找。\! -用户redis -exec chown redis '{}' +
关于redis docker镜像ENTRYPOINT脚本 docker-entrypoint.sh : #!/bin/sh set -e # first arg is `-f` or `--some-

首页

博学

6Ren·AI

商城

javascript - webpack - 找不到 manifest.json