0

在我的 React 应用程序中,我想使用style-loader/css-loader和 Webpack 从另一个 Node 模块导入样式表react-quill- https://github.com/zenomaro/react-quill。不过,我显然没有正确配置它,因为我的应用程序抛出了错误

.ql-container {
^
SyntaxError: Unexpected token .
    at Object.exports.runInThisContext (vm.js:76:16)
    at Module._compile (module.js:542:28)
    at Module._extensions..js (module.js:579:10)
    at Object.require.extensions.(anonymous function) [as .js] (/Users/username/Desktop/Development/project/node_modules/babel-register/lib/node.js:152:7)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/username/Desktop/Development/project/src/Quill/Quill.jsx:2:1)

按照react-quill文档,我已使用将样式表导入到我的Quill.jsx组件中

import theme from 'react-quill/dist/quill.snow.css'

和我的 Webpack 配置:

module.exports = {
  entry: './src/index.jsx',
  output: {
    filename: './public/bundle.js',
    publicPath: '/'
  },
  module: {
    loaders: [
      { 
        test: /\.jsx?$/, 
        exclude: /node_modules/, 
        loader: 'babel-loader',
        query: {
          presets:['react','es2015','stage-2']
        }
      },
      {
        test: /\.css$/,
        loader: "style-loader!css-loader"
      }
    ]
  }
}

并查看我的bundle.js,我可以看到 Quill 样式表已包含在构建中。

最后,其中一个错误是指babel-register,我在开发中使用它来处理服务器端渲染的动态转译 - 它显示为

require('babel-register')({
    presets: ['es2015','react','stage-2']
})

任何人都可以提供任何指导吗?

4

0 回答 0