我目前正在将构建过程从Browserify切换到Webpack。由于该项目使用了大量的咖啡脚本,因此我有许多导入语句,例如:
require('./coffee-file-without-extension') # note the lack of .coffee
require('./legacy-js-file-without-extension') # note the lack of .js
Browserify正好处理文件扩展名的缺失。 Webpack似乎有问题:
找不到模块:错误:无法解析'/ Users / jusopi / Dev / Workspaces / nx / nx-ui / src'中的'./wptest-req'
我为此设置了一个超级简单的测试项目,其中包含以下文件:
wptest.coffee
require('./wptest-req')
wptest-req.coffee
module.exports = {}
webpack.config.js
const path = require('path');
const webpack = require('webpack')
module.exports = {
entry: {
main: './src/wptest.coffee'
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, 'dist')
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: 'common' // Specify the common bundle's name.
})
],
module: {
rules: [
{
test: /\.coffee$/,
use: [
{
loader: 'coffee-loader',
options: { sourceMap: true }
}
]
}
]
}
};
我希望我不必在我们的应用程序中查看每个文件,并且如果可能的话,将.coffee
附加到咖啡文件的所有require语句中。
答案 0 :(得分:1)
虽然这个解决方案不是特定于咖啡加载器,但确实解决了我的问题。我需要在配置中添加resolve
对象:
const path = require('path');
const webpack = require('webpack')
module.exports = {
entry: {
main: './src/main.coffee'
// other: './src/index2.js'
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, 'dist')
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: 'common' // Specify the common bundle's name.
})
],
module: {
rules: [
{
test: /\.coffee$/,
use: [
{
loader: 'coffee-loader',
options: { sourceMap: true }
}
]
}
]
},
resolve: {
extensions: [ '.coffee', '.js' ]
}
};
src - https://github.com/webpack-contrib/coffee-loader/issues/36