我在安装webpack反应时遇到问题

时间:2020-04-25 06:41:20

标签: javascript reactjs webpack jsx eslint

这是错误

'React' is defined but never used

这是文件app.js

import React from 'react';

此文件webpack.config.js

const path = require("path");
module.exports = {
  context: __dirname,
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "main.js",
    publicPath: "/",
  },
  devServer: {
    historyApiFallback: true,
  },
  module: {
    rules: [
      {
        test: /\.js?$/,
        exclude: /node_module/,
        use: "babel-loader",
      },
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"],
      },
      {
        test: /\.(png|j?g|svg|gif)?$/,
        use: "file-loader",
      },
    ],
  },
  plugins: [
    new HtmlWebPackPlugin({
      template: path.resolve(__dirname, "public/index.html"),
      filename: "index.html",
    }),
  ],
};

这是我学到的链接 https://medium.com/@imranhsayed/set-up-react-app-with-webpack-webpack-dev-server-and-babel-from-scratch-df398174446d

我在step7中遇到问题,我安装了npm install eslint-plugin-react --save-dev,但无法解决此问题。

2 个答案:

答案 0 :(得分:0)

请澄清一下,这是您app.js文件的全部内容吗?

import React from 'react';

还是您还按照链接的第7步编写了app.js文件的其余部分?

您看到的错误消息表明您已导入模块(React),但尚未将其用于任何事情。如果import React from 'react';是您app.js文件的全部内容,那么这是可以预期的;当您完成编写app.js文件时,此错误消息将消失。

答案 1 :(得分:0)

您走的路需要大量的手工工作。对于初学者甚至是经验丰富的用户,我强烈建议使用众所周知的CRA工具(create-react-app)。会为您设置所有内容,包括Babel和Webpack。当然,这取决于实际的React项目,但是我发现这是一个很好的开始。