8

我正在尝试在节点中使用 create-react-kotlin-app 在 kotlin-react 应用程序中使用 scss 以便于引导，但我坚持设置配置以使其工作

我已经弹出了，所以我可以手动编辑 webpack 配置。我已经将以下内容添加到 dev config 和对应的 prod.config 中。

  {
    test: /\.scss$/,
    use: [
      require.resolve('style-loader'),
      {
        loader: require.resolve('sass-loader'),
        options: {
          importLoaders: 1,
        },
      },
      {
        loader: require.resolve('postcss-loader'),
        options: {
          ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
          plugins: () => [
            require('postcss-flexbugs-fixes'),
            autoprefixer({
              browsers: [
                '>1%',
                'last 4 versions',
                'Firefox ESR',
                'not ie < 9', // React doesn't support IE8 anyway
              ],
              flexbox: 'no-2009',
            }),
          ],
        },
      },
    ],
  },

修改 package.json 并运行 npm install

"babel": {
 "presets": [
   "react-app"
 ],
 "plugins": [
   [
     "babel-plugin-react-css-modules",
     {
       "filetypes": {
         ".scss": {
           "syntax": "postcss-scss"
         }
       }
     }
   ]
 ]
}

并添加到 index.kt

requireAll(require.context("src", true, js("/\\.scss$/")))

node 中 create-react-app 的最新配置已经支持 scss，所以我按照本教程https://medium.com/front-end-weekly/how-to-add-sass-or-scss-to-create- react-app-c303dae4b5bc因为在 create-react-kotlin 应用程序中 webpack 配置的弹出结果几乎相同，但仍然没有运气。

4

0 回答 0