Subscribe on changes!

`vite build` errors on brand new vite app

avatar
May 5th 2020

This is probably a user error since I've never used rollup before. On a brand new vite app created with create-vite-app vvv I am able to run the app with npx vite and browse to localhost just fine. Running npx vite build however throws an error:

~/Src/vvv$ npx vite build
vite v0.10.3
Building for production...
[vite] Build errored out.
Error: Unexpected token (Note that you need plugins to import files that are not JavaScript)
    at error (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:161:30)
    at Module.error (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:14994:16)
    at tryParse (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:14884:23)
    at Module.setSource (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:15303:30)
    at C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:17338:20
    at async C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:17187:28
    at async Promise.all (index 0)
    at async Promise.all (index 0)
    at async getCombinedPromise (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:17259:13)
    at async ModuleLoader.awaitLoadModulesPromise (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:17264:9) {
  code: 'PARSE_ERROR',
  parserError: SyntaxError: Unexpected token (1:0)
      at Object.pp$4.raise (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:3399:13)
      at Object.pp.unexpected (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:1248:8)
      at Object.pp$3.parseExprAtom (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:2822:10)
      at Object.parseExprAtom (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:5836:77)
      at Object.pp$3.parseExprSubscripts (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:2651:19)
      at Object.pp$3.parseMaybeUnary (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:2628:17)
      at Object.parseMaybeUnary (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:5720:29)
      at Object.pp$3.parseExprOps (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:2572:19)
      at Object.pp$3.parseMaybeConditional (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:2555:19)
      at Object.pp$3.parseMaybeAssign (C:\Src\vvv\node_modules\rollup\dist\shared\rollup.js:2528:19) {
    pos: 0,
    loc: Position { line: 1, column: 0 },
    raisedAt: 1
  },
  pos: 0,
  loc: { column: 0, file: 'C:\\Src\\vvv\\index.html', line: 1 },
  frame: '1: <div id="app"></div>\n' +
    '   ^\n' +
    '2: <script type="module">\n' +
    "3: import { createApp } from 'vue'",
  watchFiles: [ 'C:\\Src\\vvv\\index.html' ]
}

I do see the Note that you need plugins to import files that are not JavaScript warning, and the error seems to suggest that it's trying to parse index.html line 1 column 0.

What sort of things do I have to do to make this work? Should vite build be trying to rollup index.html? Do I need to install the @rollup/plugin-html package?

Environment: uname: CYGWIN_NT-10.0-WOW npm: 6.14.5 node: v12.16.3 rollup versions in package-json.lock:

  • @rollup/plugin-alias: 3.1.0
  • @rollup/plugin-json: 4.0.3
  • @rollup/plugin-node-resolve: 7.1.3
  • @rollup/plugin-replace: 2.3.2
  • @rollup/pluginutils: 3.0.10
  • rollup: 2.7.6
  • rollup-plugin-terser: 5.3.0
  • rollup-plugin-vue: 6.0.0-alpha.8
  • rollup-pluginutils: 2.8.2
avatar
May 6th 2020

isn't the build command...

npm run build
avatar
May 6th 2020

isn't the build command...

npm run build

That gives the same error.

avatar
May 6th 2020

We probably need to add Windows CI at some point, most likely a Windows path related problem.

avatar
May 7th 2020

Should be fixed in 0.11.4.

avatar
May 11th 2020

@yyx990803 This is still broken in v0.14.1 Build errored out with PARSE_ERROR on index.html, line 1 pos 0, which is now the <!DOCTYPE html> tag.

avatar
May 11th 2020

All CI is passing so nothing can be done without a reproduction.

avatar
Jan 18th 2021

I'm having the same error too and it is related to case missmatch with windows drive letters in rollup. The problem is with load function in htmlPlugin:

const htmlPlugin: Plugin = {
    name: 'vite:html',
    async load(id) {
      if (id === indexPath) { // fails if windows drive letter case missmatch
        return js
      }
    },
    ...
  }

If I change this to if (id.toLowerCase() === indexPath.toLowerCase()) or something like this (widows path's are case insensitive), it works as expected.

avatar
Jan 18th 2021

@dariuski looks like you are using an outdated version. There's no longer such code in the latest release.