小编Yev*_*pak的帖子

我正在尝试将 scss 添加到项目中。我想从 scss 文件构建 css 文件，但自从我添加MiniCssExtractPlugin以来，我收到一条错误消息“TypeError：弱集中使用的值无效” 。这是我的webpack.config.js：

const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const config = {
  // TODO: Add common Configuration
  module: {},
};

const js = Object.assign({}, config, {
  name: 'js',
  entry: path.resolve(__dirname, 'index.js'),
  output: {
    path: path.resolve(__dirname, '../some/path/here'),
    filename: 'main.js',
  },
});

const scss = Object.assign({}, config, {
  name: 'scss',
  entry: path.resolve(__dirname, './scss/styles.scss'),
  plugins: [
    new MiniCssExtractPlugin({
      filename: '[name].css',
    }),
  ],
  module: {
    rules: [
      {
        test: /\.(s*)css$/,
        use: [ …

我正在尝试通过 id 获取元素。（这是重现错误的示例代码）

function MyComponent(){
  const myId = useId();

  useEffect(() => {
    const myComponentDOMElement = document.querySelector(`#${myId}`); // error here
    }
  )

  return <div id={ myId }> text </div>
}

这段代码给出了一个错误：

Uncaught DOMException: Failed to execute 'querySelector' on 'Document': '#:Rt6m:' is not a valid selector.

useRef 在我的情况下无法帮助我。如何使用 ID 来获取元素。