我继承了一些我无法更改的 javaScript/typeScript 代码。
使用:
- 保险丝 v0.4.0
- 保险丝盒 v4.0.0,
- 打字稿4.1.3
- 我正在生成一个 bundle & sourceMap (bundle.js, bundle.js.map)
此 sourceMap 有效,但仅当我对 bundle.js.map 中的“源”进行文本替换时
发现 :
src/
- {"版本":3,"来源":["/src/lib/development.ts","/src/lib/server.ts"
替换为:
../../
- {"version":3,"sources":["../../lib/development.ts","../../lib/server.ts"
根据文档,我应该能够在 fuse.js 中设置 sourceRoot 属性。但无论我设置什么值,bundle.js.map 的输出都不会受到影响。
我的文件夹树如下所示:
我的 fuse.js 看起来像这样:
task('default', async () => {
const fuse = FuseBox.init({
allowSyntheticDefaultImports: true,
homeDir: '.',
output: 'build/$name.js',
target: 'universal',
sourceMaps: { inline: false, sourceRoot: "" },
// sourceMaps: { sourceRoot: "/src" },
// sourceMaps: { sourceRoot: "/../.." },
// sourceMaps: { sourceRoot: "test" },
plugins: [
EnvPlugin({
DB_HOST: '127.0.0.1',
DB_USER: 'appadmin',
DB_PASSWORD: 'password',
NODE_ENV: 'development',
REDIS_HOST: '192.168.100.17',
REDIS_PORT: '6379'
}),
[
CSSResourcePlugin({
inline: true
}),
CSSPlugin()
],
ImageBase64Plugin(),
JSONPlugin(),
RawPlugin(['.dot']),
SVGPlugin(),
WebIndexPlugin({
bundles: ['client/vendors', 'client/app'],
template: 'public/index.html'
})
]
})
fuse.register('fbjs', {
main: 'index.js',
homeDir: 'node_modules/fbjs',
instructions: ' '
})
fuse.bundle('client/vendors')
.target('browser@es5')
.watch("client/vendors/**")
.hmr({ reload: true })
.instructions('~ client/index.tsx')
fuse.bundle('client/app')
.target('browser@es5')
.watch("client/**")
.hmr({ reload: true })
.instructions('> [client/index.tsx]')
fuse.bundle('server/bundle')
.target('server@esnext')
.watch('server/**')
.instructions('> [lib/development.ts]')
.completed(process => process.start())
fuse.dev()
await fuse.run()
})
task('production', async () => {
const client = FuseBox.init({
allowSyntheticDefaultImports: true,
homeDir: '.',
output: 'build/$name.js',
target: 'browser@es5',
plugins: [
EnvPlugin({
NODE_ENV: 'production'
}),
[
CSSResourcePlugin({
inline: true
}),
CSSPlugin()
],
ImageBase64Plugin(),
JSONPlugin(),
SVGPlugin(),
WebIndexPlugin({
template: 'public/index.html'
}),
QuantumPlugin({
bakeApiIntoBundle: true
})
]
})
const server = FuseBox.init({
homeDir: '.',
output: 'build/$name.js',
target: 'server@esnext',
plugins: [
EnvPlugin({
NODE_ENV: 'production'
}),
RawPlugin(['.dot']),
QuantumPlugin({
bakeApiIntoBundle: true,
containedAPI: true,
replaceProcessEnv: false
})
]
})
client.bundle('client/vendors').instructions('~ client/index.tsx')
client.bundle('client/app').instructions('!> [client/index.tsx]')
server.bundle('server/bundle').instructions('!> [lib/production.ts]')
await client.run()
await server.run()
})
task('generate-schema', async () => {
const fuse = FuseBox.init({
homeDir: '.',
output: 'build/$name.js',
target: 'server@esnext',
plugins: [
EnvPlugin({
NODE_ENV: 'development'
})
]
})
fuse.bundle('generate-schema')
.target('server@esnext')
.instructions('> [lib/generateSchema.ts]')
.completed(process => process.start())
await fuse.run()
})
task('generate-data', async () => {
const commandOptions = process.argv
commandOptions.shift()
commandOptions.shift()
const fuse = FuseBox.init({
homeDir: '.',
output: 'build/$name.js',
target: 'server@esnext',
plugins: [
EnvPlugin({
NODE_ENV: 'development'
})
]
})
fuse.bundle('generate-data')
.target('server@esnext')
.instructions('> [lib/generateData.ts]')
.completed(process => process.start(commandOptions))
await fuse.run()
})
'''