在我的 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']
})
任何人都可以提供任何指导吗?