\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0Vue \u9879\u76ee\u542f\u52a8\u662f\u524d\u7aef\u5f00\u53d1\u7684\u57fa\u7840\u64cd\u4f5c，\u4f46\u5f88\u591a\u65b0\u624b（\u751a\u81f3\u6709\u7ecf\u9a8c\u7684\u5f00\u53d1\u8005）\u90fd\u4f1a\u9047\u5230\u00a0npm run dev（\u6216\u00a0npm run serve）\u542f\u52a8\u5931\u8d25\u7684\u95ee\u9898：\u8981\u4e48\u7ec8\u7aef\u62a5\u9519\u4e00\u5806\u7ea2\u5b57，\u8981\u4e48\u6d4f\u89c8\u5668\u767d\u5c4f，\u8981\u4e48\u63d0\u793a\u7aef\u53e3\u88ab\u5360\u7528\u3002\u672c\u6587\u6574\u7406\u4e86 6 \u4e2a\u6700\u5e38\u89c1\u7684\u5931\u8d25\u539f\u56e0，\u6bcf\u4e2a\u539f\u56e0\u90fd\u9644\u8be6\u7ec6\u89e3\u51b3\u65b9\u6848，\u770b\u5b8c\u5c31\u80fd\u89e3\u51b3 99% \u7684\u542f\u52a8\u95ee\u9898\u3002<\/p>\n
Vue 2 \u9879\u76ee\u901a\u5e38\u7528\u00a0npm run dev，Vue 3 + Vite \u6216\u65b0\u7248 Vue-CLI \u9879\u76ee\u7528\u00a0npm run serve，\u672c\u8d28\u90fd\u662f\u542f\u52a8\u5f00\u53d1\u670d\u52a1\u5668，\u672c\u6587\u89e3\u51b3\u65b9\u6848\u5bf9\u4e24\u8005\u5747\u9002\u7528\u3002<\/p>\n
\u7ec8\u7aef\u62a5\u9519：Error: listen EADDRINUSE: address already in use :::8080，\u6216\u542f\u52a8\u540e\u6d4f\u89c8\u5668\u65e0\u6cd5\u8bbf\u95ee\u00a0localhost:8080\u3002<\/p>\n
# \u76f4\u63a5\u6307\u5b9a\u7aef\u53e3\u542f\u52a8
\nnpm run dev — –port 8081
\n# \u6216
\nnpm run serve — –port 8081<\/p>\n
module.exports = {
\n devServer: {
\n port: 8081, \/\/ \u6539\u4e3a\u672a\u88ab\u5360\u7528\u7684\u7aef\u53e3（\u59828082\u30018888）
\n open: true \/\/ \u53ef\u9009：\u542f\u52a8\u540e\u81ea\u52a8\u6253\u5f00\u6d4f\u89c8\u5668
\n }
\n}<\/p>\n
# Windows：\u67e5\u770b8080\u7aef\u53e3\u5360\u7528\u8fdb\u7a0b
\nnetstat -ano | findstr "8080"
\n# \u6740\u6b7b\u8fdb\u7a0b（\u66ff\u6362\u4e3a\u67e5\u5230\u7684PID）
\ntaskkill \/F \/PID 12345<\/p>\n
# Linux\/Mac：\u67e5\u770b8080\u7aef\u53e3\u5360\u7528\u8fdb\u7a0b
\nlsof -i:8080
\n# \u6740\u6b7b\u8fdb\u7a0b
\nkill -9 12345<\/p>\n
\u7ec8\u7aef\u62a5\u9519：module not found: Error: Can't resolve 'vue' in xxx\u00a0\u6216\u00a0npm ERR! code ERESOLVE（\u4f9d\u8d56\u89e3\u6790\u5931\u8d25）\u3002<\/p>\n
# Windows
\nrmdir \/s node_modules
\ndel package-lock.json<\/p>\n
# Linux\/Mac
\nrm -rf node_modules package-lock.json yarn.lock<\/p>\n
# \u4e34\u65f6\u7528\u6dd8\u5b9d\u6e90
\nnpm install –registry=https:\/\/registry.npmmirror.com<\/p>\n
# \u6216\u6c38\u4e45\u914d\u7f6e\u6dd8\u5b9d\u6e90（\u540e\u7eed\u5b89\u88c5\u90fd\u5feb）
\nnpm config set registry https:\/\/registry.npmmirror.com
\nnpm install<\/p>\n
\u7ec8\u7aef\u62a5\u9519：npm ERR! Unsupported engine\u00a0\u6216\u542f\u52a8\u540e\u51fa\u73b0\u5927\u91cf\u8bed\u6cd5\u9519\u8bef（\u5982\u00a0Unexpected token ?）\u3002<\/p>\n
Vue 2 \u63a8\u8350 Node 12.x – 16.x，Vue 3 \u63a8\u8350 Node 16.x \u53ca\u4ee5\u4e0a，\u7248\u672c\u8fc7\u9ad8 \/ \u8fc7\u4f4e\u90fd\u4f1a\u5bfc\u81f4\u542f\u52a8\u5931\u8d25：<\/p>\n
# Windows\/Mac\/Linux \u5b89\u88c5nvm（\u53c2\u8003nvm\u5b98\u7f51：https:\/\/github.com\/nvm-sh\/nvm）
\n# \u5b89\u88c5\u6307\u5b9a\u7248\u672cNode
\nnvm install 16.18.0
\n# \u4f7f\u7528\u8be5\u7248\u672c
\nnvm use 16.18.0<\/p>\n
node -v # \u8f93\u51fav16.18.0\u5373\u53ef<\/p>\n
\u7ec8\u7aef\u62a5\u9519：Syntax Error: Unexpected token\u00a0\u6216\u00a0Module parse failed: Unexpected character '@'\u3002<\/p>\n
module.exports = {
\n lintOnSave: false \/\/ \u5173\u95edESLint\u6821\u9a8c
\n}<\/p>\n
\u9879\u76ee\u80fd\u542f\u52a8，\u4f46\u6d4f\u89c8\u5668\u63a7\u5236\u53f0\u62a5\u9519：Failed to fetch\u00a0\u6216\u00a0404 Not Found，\u9875\u9762\u767d\u5c4f\u65e0\u6570\u636e\u3002<\/p>\n
\u68c0\u67e5\u00a0vue.config.js\u00a0\u4e2d\u7684\u4ee3\u7406\u914d\u7f6e\u662f\u5426\u6b63\u786e（\u4ee5\u5bf9\u63a5\u672c\u5730\u540e\u7aef\u63a5\u53e3\u4e3a\u4f8b）：<\/p>\n
module.exports = {
\n devServer: {
\n proxy: {
\n '\/api': { \/\/ \u63a5\u53e3\u524d\u7f00
\n target: 'http:\/\/localhost:3000', \/\/ \u540e\u7aef\u63a5\u53e3\u5730\u5740
\n changeOrigin: true, \/\/ \u5f00\u542f\u8de8\u57df
\n pathRewrite: { '^\/api': '' } \/\/ \u53bb\u6389\u524d\u7f00（\u540e\u7aef\u63a5\u53e3\u65e0\/api\u65f6\u914d\u7f6e）
\n }
\n }
\n }
\n}<\/p>\n
\u914d\u7f6e\u540e\u91cd\u542f\u9879\u76ee，\u9a8c\u8bc1\u63a5\u53e3\u662f\u5426\u80fd\u6b63\u5e38\u8bf7\u6c42\u3002<\/p>\n
\u65e0\u660e\u663e\u62a5\u9519，\u4f46\u542f\u52a8\u540e\u9875\u9762\u65e0\u54cd\u5e94，\u6216\u4fee\u6539\u914d\u7f6e\u540e\u4e0d\u751f\u6548\u3002<\/p>\n
npm cache clean –force<\/p>\n
# Vite\u9879\u76ee
\nnpm run clean
\n# \u6216\u624b\u52a8\u5220\u9664node_modules\/.vite
\nrm -rf node_modules\/.vite<\/p>\n
\u6267\u884c\u00a0npm run dev\u00a0\u540e，\u7ec8\u7aef\u8f93\u51fa\u4ee5\u4e0b\u5185\u5bb9\u5373\u4e3a\u6210\u529f：<\/p>\n
App running at:
\n – Local: http:\/\/localhost:8081\/
\n – Network: http:\/\/192.168.1.100:8081\/<\/p>\n
Note that the development build is not optimized.
\n To create a production build, run npm run build.<\/p>\n
\u6b64\u65f6\u6253\u5f00\u6d4f\u89c8\u5668\u8bbf\u95ee\u00a0http:\/\/localhost:8081，\u80fd\u6b63\u5e38\u663e\u793a\u9879\u76ee\u9875\u9762\u5373\u53ef\u3002<\/p>\n
Vue \u9879\u76ee\u542f\u52a8\u662f\u524d\u7aef\u5f00\u53d1\u7684\u57fa\u7840\u64cd\u4f5c，\u4f46\u5f88\u591a\u65b0\u624b（\u751a\u81f3\u6709\u7ecf\u9a8c\u7684\u5f00\u53d1\u8005）\u90fd\u4f1a\u9047\u5230\u00a0npm run dev（\u6216\u00a0npm run serve）\u542f\u52a8\u5931\u8d25\u7684\u95ee\u9898：\u8981\u4e48\u7ec8\u7aef\u62a5\u9519\u4e00\u5806\u7ea2\u5b57，\u8981\u4e48\u6d4f\u89c8\u5668\u767d\u5c4f，\u8981\u4e48\u63d0\u793a\u7aef\u53e3\u88ab\u5360\u7528\u3002\u672c\u6587\u6574\u7406\u4e86 6 \u4e2a\u6700\u5e38\u89c1\u7684\u5931\u8d25\u539f\u56e0，\u6bcf\u4e2a\u539f\u56e0\u90fd\u9644\u8be6\u7ec6\u89e3\u51b3\u65b9\u6848，\u770b\u5b8c\u5c31\u80fd\u89e3\u51b3 99% \u7684\u542f\u52a8\u95ee\u9898\u3002\u5148\u660e\u786e：npm ru<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[90,625,87],"topic":[],"class_list":["post-65156","post","type-post","status-publish","format-standard","hentry","category-server","tag-npm","tag-vue-js","tag-87"],"yoast_head":"\n