Need help pls to figure out the error below. I tried to deploy my gatsby Wordpress website on netlify but have this error that occurs?
7:24:55 PM: failed Building static HTML for pages - 0.556s 7:24:55 PM: error Building static HTML failed for path "/search/" 7:24:55 PM: 7:24:55 PM: 8 | 7:24:55 PM: 9 | const SearchPage = ({ location }) => { 7:24:55 PM: > 10 | const { userQuery, searchQuery } = location.state 7:24:55 PM: | ^ 7:24:55 PM: 11 | 7:24:55 PM: 12 | const [searchData, setSearchData] = useState([]) 7:24:55 PM: 13 | const [currentPage, setCurrentPage] = useState(1) 7:24:55 PM: 7:24:55 PM: WebpackError: TypeError: Cannot destructure property 'userQuery' of 'location. state' as it is undefined. 7:24:55 PM: 7:24:55 PM: - search.js:10 7:24:55 PM: mugentage/src/pages/search.js:10:11 7:24:55 PM: 7:24:55 PM: - extends.js:6 7:24:55 PM: [mugentage]/[@babel]/runtime/helpers/extends.js:6:1 7:24:55 PM: 7:24:55 PM: - extends.js:9 7:24:55 PM: [mugentage]/[@babel]/runtime/helpers/extends.js:9:1 7:24:55 PM: 7:24:55 PM: - extends.js:14 7:24:55 PM: [mugentage]/[@babel]/runtime/helpers/extends.js:14:1 7:24:55 PM: 7:24:55 PM: - static-entry.js:263 7:24:55 PM: mugentage/.cache/static-entry.js:263:20 7:24:55 PM: 7:24:55 PM: 7:24:55 PM: 7:24:55 PM: ──────────────────────────────────────────────────────────────── 7:24:55 PM: "build.command" failed 7:24:55 PM: ──────────────────────────────────────────────────────────────── 7:24:55 PM: 7:24:55 PM: Error message 7:24:55 PM: Command failed with exit code 1: npm run build 7:24:55 PM: 7:24:55 PM: Error location 7:24:55 PM: In Build command from Netlify app: 7:24:55 PM: npm run build 7:24:55 PM: 7:24:55 PM: Resolved config 7:24:55 PM: build: 7:24:55 PM: command: npm run build 7:24:55 PM: commandOrigin: ui 7:24:55 PM: environment: 7:24:55 PM: - REACT_APP_DISQUS_ID 7:24:55 PM: - REACT_APP_INSTAGRAM_TOKEN 7:24:55 PM: publish: /opt/build/repo/public 7:24:55 PM: publishOrigin: ui 7:24:55 PM: plugins: 7:24:55 PM: - inputs: {} 7:24:55 PM: origin: ui 7:24:55 PM: package: '@netlify/plugin-gatsby'
According to the error:
7:24:55 PM: 9 | const SearchPage = ({ location }) => { 7:24:55 PM: > 10 | const { userQuery, searchQuery } = location.state
Your SearchPage is destructuring location when, for some reason, it can be undefined or null, breaking the following destructuring.
To bypass it, add a default value to location prop just like:
const SearchPage = ({ location={} }) => {
Even something like location={state:{}}.
As I said in the comments, your code won't work locally either so first needs to be fixed there before pushing it or deploying it. It's far way easier to debug locally than trying things and testing them live, where the logs are more limited.
Check-in which cases the location is reaching null value to find the source of the error.