Question

我正在使用webpack和node来构建我的应用程序。 JS代码需要scss文件。它看起来像这样：

require('babel-register');
require("./test.scss");
import React from 'react';

class MyClass extends React.Component
....

我有webpack配置将所有scss捆绑到一个文件

{test: /(\.css|\.scss)$/, loader: ExtractTextPlugin.extract('css?sourceMap!sass?sourceMap') },

webpack配置工作正常，可以将scss编译为css 。但是，当我运行node test.js时，它会抛出一些babel-register错误，它会抱怨不理解scss语法。

我不知道我们怎么做才能让节点或者babel明白scss文件应该更好地处理甚至被忽略，因为webpack已经捆绑了它。

非常感谢提前

Answer 1

我们发现的最佳解决方法是要求componentDidMount中的SCSS文件：

import React from 'react';

class MyClass extends React.Component {
  componentDidMount() {
    require("./test.scss");
  }

  render() {
    return //...
  }
}

这样，节点运行时永远不会看到非JS模块，它仍然适用于webpack，因为它只是在代码中的某处查找require语句。

如何让节点运行需要scss文件的JS文件

1 个答案: