Subscribe on changes!

npx example not working : module not found

avatar
Apr 21st 2020

First : Congratulations on thinking about it, coding it and sharing it ! :tada:

I have tried to run npx vite with the example. The server starts, but does not display the page. The devtool shows a 404 on localhost:3000/__modules/vue. Please find the stack trace below.

My config :

Debian GNU/Linux 10 (buster)
❯ node --version
v12.14.1
❯ npm --version
6.14.4
❯ npx vite
npx : 70 installé(s) en 5.322s
Running at http://localhost:3000
Error: Cannot find module 'vue/package.json'
Require stack:
- /home/fkerisit/tmp/vite-test/noop.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17)
    at resolveFileName (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/resolve-from/index.js:29:39)
    at resolveFrom (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/resolve-from/index.js:43:9)
    at Object.module.exports [as default] (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/resolve-from/index.js:46:47)
    at Object.resolveModule (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/dist/server/moduleResolver.js:25:44)
    at Server.<anonymous> (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/dist/server/server.js:25:37)
    at Server.emit (events.js:223:5)
    at parserOnIncoming (_http_server.js:748:12)
    at HTTPParser.parserOnHeadersComplete (_http_common.js:115:17) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [ '/home/fkerisit/tmp/vite-test/noop.js' ]
}
(node:7688) UnhandledPromiseRejectionWarning: SyntaxError: Unexpected token, expected "," (4:0)
    at Parser._raise (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:742:17)
    at Parser.raiseWithData (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:735:17)
    at Parser.raise (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:729:17)
    at Parser.unexpected (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:8757:16)
    at Parser.expect (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:8743:28)
    at Parser.parseObj (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:10365:14)
    at Parser.parseExprAtom (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9995:28)
    at Parser.parseExprSubscripts (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9602:23)
    at Parser.parseMaybeUnary (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9582:21)
    at Parser.parseExprOps (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9452:23)
    at Parser.parseMaybeConditional (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9425:23)
    at Parser.parseMaybeAssign (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9380:21)
    at Parser.parseExportDefaultExpression (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:12283:24)
    at Parser.parseExport (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:12185:31)
    at Parser.parseStatementContent (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:11185:27)
    at Parser.parseStatement (/home/fkerisit/.npm/_npx/7688/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:11081:17)
(node:7688) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:7688) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
avatar
Apr 21st 2020

hmm I realized it probably works for me because I have vue installed in the resolve tree in my local test directory. For users you need to install vue@next in the directory.

avatar
Apr 21st 2020

Thank you for your answer, @yyx990803 ! Installing vue@next has solved the missing module issue, but there appears to be a syntax error remaining :

❯ npm init
...
 
❯ npm install vue@next
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN vite-test@1.0.0 No description
npm WARN vite-test@1.0.0 No repository field.

+ vue@3.0.0-beta.3
added 15 packages from 43 contributors and audited 20 packages in 3.004s
found 0 vulnerabilities

❯ npx vite
npx : 70 installé(s) en 18.083s
Running at http://localhost:3000
(node:9420) UnhandledPromiseRejectionWarning: SyntaxError: Unexpected token, expected "," (4:0)
    at Parser._raise (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:742:17)
    at Parser.raiseWithData (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:735:17)
    at Parser.raise (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:729:17)
    at Parser.unexpected (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:8757:16)
    at Parser.expect (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:8743:28)
    at Parser.parseObj (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:10365:14)
    at Parser.parseExprAtom (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9995:28)
    at Parser.parseExprSubscripts (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9602:23)
    at Parser.parseMaybeUnary (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9582:21)
    at Parser.parseExprOps (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9452:23)
    at Parser.parseMaybeConditional (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9425:23)
    at Parser.parseMaybeAssign (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:9380:21)
    at Parser.parseExportDefaultExpression (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:12283:24)
    at Parser.parseExport (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:12185:31)
    at Parser.parseStatementContent (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:11185:27)
    at Parser.parseStatement (/home/fkerisit/.npm/_npx/9420/lib/node_modules/vite/node_modules/@babel/parser/lib/index.js:11081:17)
(node:9420) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:9420) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
avatar
Apr 21st 2020

@FanchGadjo Try removing all extra commas or semicolon. You should be end up with something like this.

<template>
  <button @click="count++">{{ count }}</button>
</template>

<script>
export default {
  data: () => ({ count: 0 })
}
</script>

<style scoped>
button {
  color: red;
}
</style>

I have prettier installed and it adds a semicolon to the braces and that was breaking vite.

avatar
Apr 21st 2020

Your solution worked for me, @DannyFeliz ! Thank you.

avatar
Apr 21st 2020

0.1.2 should no longer require a local install of vue@next and just work out of the box.