这是我的问题:
当我使用contenthash
作为捆绑的文件名时,生产构建失败。
我遇到以下错误:
Unhandled rejection Error: "." is not in the SourceMap.
at BasicSourceMapConsumer.SourceMapConsumer_sourceContentFor [as sourceContentFor] (C:\Users\USER\Documents\Projects\my-project\node_modules\source-map\lib\source-map-consumer.js:753:13)
at C:\Users\USER\Documents\Projects\my-project\node_modules\webpack-sources\lib\applySourceMap.js:88:47
at SourceNode_walk [as walk] (C:\Users\USER\Documents\Projects\my-project\node_modules\source-map\lib\source-node.js:230:9)
at SourceNode_walk [as walk] (C:\Users\USER\Documents\Projects\my-project\node_modules\source-map\lib\source-node.js:226:13)
at applySourceMap (C:\Users\USER\Documents\Projects\my-project\node_modules\webpack-sources\lib\applySourceMap.js:58:13)
at SourceMapSource.node (C:\Users\USER\Documents\Projects\my-project\node_modules\webpack-sources\lib\SourceMapSource.js:36:11)
at SourceMapSource.proto.sourceAndMap (C:\Users\USER\Documents\Projects\my-project\node_modules\webpack-sources\lib\SourceAndMapMixin.js:29:18)
at getTaskForFile (C:\Users\USER\Documents\Projects\my-project\node_modules\webpack\lib\SourceMapDevToolPlugin.js:64:30)
at files.forEach (C:\Users\USER\Documents\Projects\my-project\node_modules\webpack\lib\SourceMapDevToolPlugin.js:200:20)
at Array.forEach (<anonymous>)
at compilation.hooks.afterOptimizeChunkAssets.tap (C:\Users\USER\Documents\Projects\my-project\node_modules\webpack\lib\SourceMapDevToolPlugin.js:177:12)
at SyncHook.eval [as call] (eval at create (C:\Users\USER\Documents\Projects\my-project\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:7:1)
at SyncHook.lazyCompileHook (C:\Users\USER\Documents\Projects\my-project\node_modules\tapable\lib\Hook.js:154:20)
at hooks.optimizeChunkAssets.callAsync.err (C:\Users\USER\Documents\Projects\my-project\node_modules\webpack\lib\Compilation.js:1385:42)
at _err0 (eval at create (C:\Users\USER\Documents\Projects\my-project\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:11:1)
at taskRunner.run (C:\Users\USER\Documents\Projects\my-project\node_modules\terser-webpack-plugin\dist\index.js:321:9)
at step (C:\Users\USER\Documents\Projects\my-project\node_modules\terser-webpack-plugin\dist\TaskRunner.js:87:9)
at _cacache.default.get.then (C:\Users\USER\Documents\Projects\my-project\node_modules\terser-webpack-plugin\dist\TaskRunner.js:111:15)
at tryCatcher (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\util.js:16:23)
at Promise._settlePromiseFromHandler (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:517:31)
at Promise._settlePromise (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:574:18)
at Promise._settlePromise0 (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:619:10)
at Promise._settlePromises (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:699:18)
at Promise._fulfill (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:643:18)
at Promise._resolveCallback (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:437:57)
at Promise._settlePromise (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:574:18)
at Promise._settlePromise0 (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:619:10)
at Promise._settlePromises (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:699:18)
at Promise._fulfill (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:643:18)
at Promise._resolveCallback (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:437:57)
at Promise._settlePromiseFromHandler (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:529:17)
at Promise._settlePromise (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:574:18)
at Promise._settlePromise0 (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:619:10)
at Promise._settlePromises (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:699:18)
at Promise._fulfill (C:\Users\USER\Documents\Projects\my-project\node_modules\bluebird\js\release\promise.js:643:18)
这是我的webpack配置。
webpack.prod.js
const merge = require('webpack-merge');
const common = require('./webpack.common.js');
const webpack = require('webpack');
const path = require('path');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
module.exports = merge(common, {
mode: 'production',
devtool: 'source-map',
output: {
filename: '[name].[contenthash:5].js',
// filename: '[name].[hash:5].js',
path: path.resolve(__dirname, 'public'),
publicPath: '/'
},
plugins:[
// new webpack.IgnorePlugin(/fuse.js/),
new webpack.HashedModuleIdsPlugin(),
new BundleAnalyzerPlugin()
],
// Basic otimization: Single runtimeChunk + vendorsChunk
optimization:{
runtimeChunk: 'single',
splitChunks: {
cacheGroups: {
vendor: {
test: /[\\/]node_modules[\\/]/,
name: 'vendors',
chunks: 'all'
}
}
}
}
});
package.json
{
"name": "my-project",
"version": "1.0.0",
"description": "",
"private": true,
"scripts": {
"watch": "webpack --watch",
"start": "webpack-dev-server --open --config webpack.dev.js",
"build": "webpack --config webpack.prod.js",
"build-dev": "webpack --config webpack.devBuild.js",
"share": "ngrok http 8080 -host-header=\"localhost:8080\""
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@babel/cli": "^7.5.5",
"@babel/core": "^7.5.5",
"@babel/node": "^7.5.5",
"@babel/plugin-proposal-class-properties": "^7.5.5",
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
"@babel/plugin-transform-async-to-generator": "^7.5.0",
"@babel/preset-env": "^7.5.5",
"@babel/preset-react": "^7.0.0",
"babel-eslint": "^10.0.2",
"babel-loader": "^8.0.6",
"babel-plugin-styled-components": "^1.10.6",
"clean-webpack-plugin": "^3.0.0",
"css-loader": "^3.1.0",
"dotenv-webpack": "^1.6.0",
"eslint": "^6.1.0",
"eslint-import-resolver-alias": "^1.1.2",
"eslint-module-utils": "^2.4.1",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-react": "^7.14.3",
"eslint-plugin-react-hooks": "^1.6.1",
"file-loader": "^4.1.0",
"firebase-admin": "^8.3.0",
"html-webpack-plugin": "^3.2.0",
"react-hot-loader": "^4.12.10",
"style-loader": "^0.23.1",
"url-loader": "^2.1.0",
"webpack": "^4.38.0",
"webpack-bundle-analyzer": "^3.4.1",
"webpack-cli": "^3.3.6",
"webpack-dev-server": "^3.7.2",
"webpack-manifest-plugin": "^2.0.4",
"webpack-merge": "^4.1.5"
},
"dependencies": {
"@babel/polyfill": "^7.4.4",
"@hot-loader/react-dom": "^16.8.6",
"@welldone-software/why-did-you-render": "^3.2.3",
"animejs": "^3.1.0",
"body-scroll-lock": "^2.6.4",
"firebase": "^6.3.3",
"fuse.js": "^3.4.5",
"marked": "^0.7.0",
"md5": "^2.2.1",
"prop-types": "^15.7.2",
"query-string": "^6.8.2",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-router-dom": "^5.0.1",
"react-transition-group": "^4.2.1",
"sanitize-html": "^1.20.1",
"styled-components": "^4.3.2"
},
"sideEffects": [
"*.css"
]
}
[hash:5]
而不是[contenthash:5]
,它将生成无错误的内容。devtool: 'none'
而不是devtool: 'source-map'
,它的构建也不会出错。fuse.js
插件。它也可以正确构建。
new webpack.IgnorePlugin(/fuse.js/),
由于我忽略Fuse.js
软件包时错误消失了,因此我认为这是相关的。
可能会发生什么?有人遇到过这样的问题吗?