Briefly summarize the issues you have been experiencing.
Having trouble build / deploying locally working Vue component
11:47:31 PM: [192] (webpack)-dev-server/client?xxx://localhost:2000 153 bytes {0} [built] [failed] [1 error]
11:47:31 PM: + 1 hidden modules
11:47:31 PM: ERROR in (webpack)-dev-server/client?xxx://localhost:2000
11:47:31 PM: Module build failed: Error: ENOENT: no such file or directory, open ‘/opt/build/repo/node_modules/webpack-dev-server/client/index.js’
11:47:31 PM: @ multi (webpack)-dev-server/client?xxx://localhost:2000 ./app.js
11:47:31 PM: ERROR in ./docs/app.js
11:47:31 PM: Module build failed: Error: ENOENT: no such file or directory, open ‘/opt/build/repo/docs/app.js’
11:47:31 PM: @ multi (webpack)-dev-server/client?xxx://localhost:2000 ./app.js
11:47:31 PM: webpack: Failed to compile.
Please provide a link to your live site hosted on Netlify
What have you tried as far as troubleshooting goes? Do you have an idea what is causing the problem?
Clear cache Do you have any other information that is relevant, such as links to docs, libraries, or other resources?
{
“name”: “vue-table-component”,
“version”: “1.9.2”,
“description”: “A straightforward Vue component to filter and sort tables”,
“main”: “dist/index.js”,
“jsnext:main”: “src/index.js”,
“scripts”: {
“start”: “webpack-dev-server --config docs/webpack.config.js”,
“demo”: “NODE_ENV=production webpack --config docs/webpack.config.js”,
“build”: “rm -rf dist && NODE_ENV=production webpack”,
“lint”: “eslint src tests --ext .js,.vue --fix; exit 0”,
“prepublish”: “npm run test; npm run build”,
“test”: “jest”
},
Hey @rduinmaijer, thanks for notifying us of this issue. Can you give more context around what you’re trying to do so we can better help you? I see that you’re trying to deploy a component named vue table component that I believe matches this one. What build command are you using to deploy this to netlify? And do you have a link to the project online somewhere that we can dig into to help you figure this out?
Awesome, thanks for the link! It looks like the dist folder doesn’t have an index.html file. Since there isn’t any static page to load the JS, you’ll get a page not found error. As you pointed out in your earlier comment, the locally running project works unlike the prod site. This is likely because the locally running project is running from the docs folder while the prod site is running from the dist folder. If you changed your publish directory under site settings > build and deploy to docs instead of dist you might have some luck having a working site.
As for the issue you’re having with the build itself, it’s again hard for me to replicate what you’re experiencing since I’m not sure what changes were made that might be messing with the webpack build. I just pulled down the repo you’re using and managed to deploy the site successfully. Here’s a reference to that repo and a link to the running demo so you can see it live. I’ve made no changes to the original component, so it might be worth reverting your changes and stepping through them to figure out what might be causing your issue. Let me know if you need further clarification on this!
Curious, what build command are you using to run your deploy? There seems to be a 29 minute delay between webpack compiling successfully and the errors in the deploy log. That along with evidence of an open port on localhost:2000, indicates that you might be trying to run a dev server on the CDN.
Are you by chance running npm run start instead of npm run build?
If you click on your deploy on the Netlify dashboard you should be able to access the deploy logs. I’m curious, didn’t you copy/paste your logs from there for your earlier post?
There’s only one deploy log for each deploy, @rduinmaijer . Can you provide us with a link to one of your recent deploy logs for a failed build? Thanks.