これは私のオリジナルの webpack 構成ファイルで、両方が使用される 2 つの異なる構成で構成されています。
const ExtractTextPlugin = require('extract-text-webpack-plugin')
module.exports = [{
entry: __dirname + '/src/browser/main',
output: {
path: __dirname + '/dist/browser',
filename: 'bundle.js'
},
resolve: {
extensions: ['', '.js', '.ts'] // '' is needed to find modules like "jquery"
},
module: {
loaders: [
{
test: /\.ts$/,
loader: 'ts'
}
]
}
}, {
entry: ['babel-polyfill', __dirname + '/src/app/browser/app'],
output: {
path: __dirname + '/dist/app/browser',
filename: 'bundle.js'
},
resolve: {
root: ['./node_modules', './src'],
extensions: ['', '.js', '.ts'] // '' is needed to find modules like "jquery"
},
module: {
loaders: [
{
test: /\.ts$/,
loader: 'ts'
},
{
test: /\.scss$/,
loader: ExtractTextPlugin.extract('style', 'css!sass')
}
]
},
plugins: [
new ExtractTextPlugin('bundle.css')
]
}]
私のすべてのインポートは、たとえば Atom (TypeScript プラグインを備えたテキスト エディター) によって受け入れられますが、現在のところ、次の代替手段のみが機能します。
const ExtractTextPlugin = require('extract-text-webpack-plugin')
module.exports = [{
entry: __dirname + '/src/browser/main',
output: {
path: __dirname + '/dist/browser',
filename: 'bundle.js'
},
resolve: {
extensions: ['', '.js', '.ts'] // '' is needed to find modules like "jquery"
},
module: {
loaders: [
{
test: /\.ts$/,
loader: 'ts'
}
]
}
}, {
entry: ['babel-polyfill', __dirname + '/src/app/browser/app'],
output: {
path: __dirname + '/dist/app/browser',
filename: 'bundle.js'
},
resolve: {
root: ['./node_modules', './src'],
extensions: ['', '.js', '.ts'] // '' is needed to find modules like "jquery"
},
module: {
loaders: [
{
test: /\.ts$/,
loader: require.resolve('ts-loader')
},
{
test: /\.scss$/,
loader: ExtractTextPlugin.extract('style', 'css!sass')
}
]
},
plugins: [
new ExtractTextPlugin('bundle.css')
]
}]
( に注意してくださいrequire.resolve('ts-loader')
)
ご覧のとおり、最初の構成に'ts'
はまだ存在しますが (まだ機能しているため)、2 番目の構成ではrequire.resolve('ts-loader')
. 今、私はこの要件の理由を見つけようとしています。require.resolve
他のプロジェクトでも使用を余儀なくされたことは覚えていますが、その理由を認識していませんでした。
違いを生む目立たないコード行 (2 番目の構成):
import * as dateTime from 'lib/date-time/date-time'
コメントすると、 を使用して再び機能し'ts'
ます。
私のファイル システムでは、パス lib/date-time/date-time.ts は ./src (resolve/root 配列に記載されています) のすぐ下にあります。また、解決/ルート配列によっては、最初のインポートではありません。
エラーメッセージを含む Webpack 出力:
> webpack
ts-loader: Using typescript@2.1.4 and /.../src/app/browser/tsconfig.json
ts-loader: Using typescript@2.1.4 and /.../src/browser/tsconfig.json
Hash: 5058e7029f1c0243a269161aa4ddda242a3d33a0
Version: webpack 1.14.0
Child
Hash: 5058e7029f1c0243a269
Version: webpack 1.14.0
Time: 3165ms
Asset Size Chunks Chunk Names
bundle.js 283 kB 0 [emitted] main
+ 4 hidden modules
Child
Hash: 161aa4ddda242a3d33a0
Version: webpack 1.14.0
Time: 3670ms
Asset Size Chunks Chunk Names
bundle.js 617 kB 0 [emitted] main
bundle.css 25 kB 0 [emitted] main
[0] multi main 40 bytes {0} [built]
+ 329 hidden modules
ERROR in Cannot find module './node_modules/ts-loader/index.js'
@ ./src/records/departure/departure.ts 2:15-49
Child extract-text-webpack-plugin:
+ 2 hidden modules
Child extract-text-webpack-plugin:
+ 2 hidden modules
Child extract-text-webpack-plugin:
+ 2 hidden modules
Child extract-text-webpack-plugin:
+ 2 hidden modules