webpack - 工兵 webpack 警告 : 'mode' option has not been set

Question

我不是 webpack 冠军，当我使用“npx export sapper”时，我收到了这个警告

    WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/

我试图根据文档更改配置但没有任何 react (或者当我尝试使用 CLI 时出现错误...

我应该改变什么来切换到开发模式而不是默认的生产模式？
非常感谢。

这是 webpack 配置文件:

const webpack = require("webpack");
const path = require("path");
const config = require("sapper/config/webpack.js");
const pkg = require("./package.json");


// const mode = process.env.NODE_ENV;      <- Original line
const mode = "development";      //        <- my attempt
const dev = mode === "production";

const alias = { svelte: path.resolve("node_modules", "svelte") };
const extensions = [".mjs", ".js", ".json", ".svelte", ".html"];
const mainFields = ["svelte", "module", "browser", "main"];

module.exports = {
      client: {
            entry: config.client.entry(),
            output: config.client.output(),
            resolve: { alias, extensions, mainFields },
            module: {
                  rules: [
                        {
                              test: /\.(svelte|html)$/,
                              use: {
                                    loader: "svelte-loader",
                                    options: {
                                          dev,
                                          hydratable: true,
                                          hotReload: false, // pending https://github.com/sveltejs/svelte/issues/2377
                                    },
                              },
                        },
                  ],
            },
            mode,
            plugins: [
                  // pending https://github.com/sveltejs/svelte/issues/2377
                  // dev && new webpack.HotModuleReplacementPlugin(),
                  new webpack.DefinePlugin({
                        "process.browser": true,
                        "process.env.NODE_ENV": JSON.stringify(mode),
                  }),
            ].filter(Boolean),
            devtool: dev && "inline-source-map",
      },

      server: {
            entry: config.server.entry(),
            output: config.server.output(),
            target: "node",
            resolve: { alias, extensions, mainFields },
            externals: Object.keys(pkg.dependencies).concat("encoding"),
            module: {
                  rules: [
                        {
                              test: /\.(svelte|html)$/,
                              use: {
                                    loader: "svelte-loader",
                                    options: {
                                          css: false,
                                          generate: "ssr",
                                          dev,
                                    },
                              },
                        },
                  ],
            },
            mode: process.env.NODE_ENV,
            performance: {
                  hints: false, // it doesn't matter if server.js is large
            },
      },

      serviceworker: {
            entry: config.serviceworker.entry(),
            output: config.serviceworker.output(),
            mode: process.env.NODE_ENV,
      },
};

Answer 1

简答
在 webpack.config.js , 更改所有出现的 mode: process.env.NODE_ENV,为 mode, .然后设置const mode = 'development'正如你所做的那样。
长答案
这是因为 mode不一致地用于客户端、服务器和服务 worker 的配置。是mode: mode对于客户，但 mode: process.env.NODE_ENV用于服务器和服务 worker 。 Webpack 提示 mode未设置，因为 process.env.NODE_ENV未定义。
可选
您也可以修改您的 export脚本在 package.json像

  "export": "NODE_ENV='development' sapper export"

然后运行 ​​npm run export .