Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Can't parse html in dev mode #2815

Closed
6 tasks done
wyhaya opened this issue Apr 1, 2021 · 8 comments
Closed
6 tasks done

Can't parse html in dev mode #2815

wyhaya opened this issue Apr 1, 2021 · 8 comments
Labels
enhancement: pending triage

Comments

@wyhaya
Copy link

wyhaya commented Apr 1, 2021 •
edited
Loading

Describe the bug

I am writing a plugin to provide virtual html.

const html = `<!DOCTYPE html>
<html lang="en">
  <head></head>
  <body></body>
</html>
`

function htmlEntryPlugin() {
  return {
    name: 'html-entry-plugin',
    resolveId(id) {
      if(id === '/test' || id === resolve(__dirname, './test.html')) {
        return id
      }
    },
    load(id) {
      if(id === '/test' || id === resolve(__dirname, './test.html')) {
        return html
      }
    }
  }
}

export default defineConfig({
  build: {
    rollupOptions: {
        input: {
            test: resolve(__dirname, `./test.html`),
        }
    }
  },
  plugins: [htmlEntryPlugin()]
})

yarn dev

When I try to access /test in development mode, I get an error.

curl 127.0.0.1:3000/test

4:26:19 PM [vite] Internal server error: Failed to parse source for import analysis because the content contains invalid JS syntax. If you are using JSX, make sure to name the file with the .jsx or .tsx extension.
  Plugin: vite:import-analysis
  File: /test
  1  |  <!DOCTYPE html>
  2  |  <html lang="en">
  3  |    <head></head>
     |                 ^
  4  |    <body></body>
  5  |  </html>

yarn build

It doesn't look like any problem in build mode

$ vite build
vite v2.1.5 building for production...
✓ 2 modules transformed.
dist/test.html                 0.14kb
dist/assets/test.e5f6eb59.js   0.61kb / brotli: 0.31kb
✨  Done in 0.85s.

.dist
├── assets
│   └── test.e5f6eb59.js
└── test.html

Other

And I can't use the .html suffix to access it, or I'll get a 404

Reproduction

vite-project-example.zip

System Info

Output of npx envinfo --system --npmPackages vite,@vitejs/plugin-vue --binaries --browsers:

  System:
    OS: macOS 11.2.3
    Shell: 3.2.0 - /usr/local/bin/fish
  Binaries:
    Node: 15.11.0 - /usr/local/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn

Used package manager: yarn

Logs 





Before submitting the issue, please make sure you do the following


      		
    

      
  





        

            


            

              
            

        

      


      
    








      

    



      

  
            


    







      

  
      



  

  @anncwb





  


    

      

  

    

        
    
    

  


      
          
  
      
            Copy link

  

      
    

  


  

      

  
    Contributor


      

  


  

    

      

      
            anncwb
  

      

      

      commented


        Apr 2, 2021


      
    


  





      


        


  
    

      
          
From the information you provided, I am not sure what your problem is. Can you give me a reproduction?

      		
    

  





        


            

            

              
            

        

      


      

            
  

    
  
    
    

  

  



    












      

  
      



  

  @github-actions





  


    

      

  

    

        
    
    

  


      
          
  
      
            Copy link

  

      
    

  


  

      



      

  


  

    

      

      
            github-actions
  bot

      

      

      commented


        Apr 2, 2021


      
    


  





      


        


  
    

      
          
Hello @wyhaya. Please provide a online reproduction by codesandbox or a minimal GitHub repository. Issues labeled by need reproduction will be closed if no activities in 3 days.

      		
    

  





        


            

            

              
            

        

      


      

            
  

    
  
    
    

  

  



    












      

  
            







      

  
      



  

  @wyhaya





  


    

      

  

    

        
    
    

  


      
          
  
      
            Copy link

  

      
    

  


  

      



      

  Author


  


  

    

      

      
            wyhaya
  

      

      

      commented


        Apr 2, 2021


      
    


  





      


        


  
    

      
          
@anncwb I just updated the description and uploaded vite-project-example.zip

      		
    

  





        


            

            

              
            

        

      


      

            
  

    
  
    
    

  

  



    












      

  
      



  

  @anncwb





  


    

      

  

    

        
    
    

  


      
          
  
      
            Copy link

  

      
    

  


  

      

  
    Contributor


      

  


  

    

      

      
            anncwb
  

      

      

      commented


        Apr 2, 2021


      
    


  





      


        


  
    

      
          
@wyhaya I understand what you mean. Currently vite does not support this, it may be supported later. You can view this file

https://vitejs.dev/guide/#index-html-and-project-root

      		
    

  





        


            

            

              
            

        

      


      

            
  

    
  
    
    

  

  



    












      

  
      



  

  @wyhaya





  


    

      

  

    

        
    
    

  


      
          
  
      
            Copy link

  

      
    

  


  

      



      

  Author


  


  

    

      

      
            wyhaya
  

      

      

      commented


        Apr 2, 2021


      
    


  





      


        


  
    

      
          
@anncwb Thank you for your reply.


I would like to know why it is normal in build mode?


This error seems to be caused by not being able to distinguish between file types, is there a way to explicitly point out that this is an html file?

      		
    

  





        


            

            

              
            

        

      


      

            
  

    
  
    
    

  

  



    












      

  
      



  

  @anncwb





  


    

      

  

    

        
    
    

  


      
          
  
      
            Copy link

  

      
    

  


  

      

  
    Contributor


      

  


  

    

      

      
            anncwb
  

      

      

      commented


        Apr 2, 2021


      
    


  





      


        


  
    

      
          
I think it may be that the optimizer does not support virtual html files

      		
    

  





        


            

            

              
            

        

      


      

            
  

    
  
    
    

  

  



    












      

  
            







      

  
      



  

  @bluwy





  


    

      

  

    

        
    
    

  


      
          
  
      
            Copy link

  

      
    

  


  

      

  
  Member


      

  


  

    

      

      
            bluwy
  

      

      

      commented


        Mar 6, 2022


      
    


  





      


        


  
    

      
          
There's a comment at #7095 (comment) showing how to create a Vite plugin that handles virtual HTML files. It's not the most ergonomic solution right now, so perhaps this issue can be an enhancement to improve handling HTML files in Vite plugins.

      		
    

  





        


            

            

              
            

        

      


      

            
  

    
  
    
    

  

  



    












      

  
            


  

  

    
  


  

      

    @sapphi-red
sapphi-red



    mentioned this issue
    
      Apr 15, 2022
    





  


  

      
  
  Closed

  





  
  

      
        
      
      

  
    
    
  


    7 tasks
  





  




  

  

    
  


  

      

    @sapphi-red
sapphi-red



    mentioned this issue
    
      Jul 11, 2022
    





  


  

      
  
  Closed

  





  
  

      
        
      
      

  
    
    
  


    7 tasks
  





  









      

  
      



  

  @bluwy





  


    

      

  

    

        
    
    

  


      
          
  
      
            Copy link

  

      
    

  


  

      

  
  Member


      

  


  

    

      

      
            bluwy
  

      

      

      commented


        Dec 29, 2022


      
    


  





      


        


  
    

      
          
I think this is a duplicate of #2321

      		
    

  





        


            

            

              
            

        

      


      

            
  

    
  
    
    

  

  



    












      

  
            

    

      
    

    


      

          @bluwy
bluwy




            closed this as not planned
    Won't fix, can't repro, duplicate, stale


      Dec 29, 2022

    

  


    


    

    

      
    

    


      

          @github-actions
github-actions
bot



        locked and limited conversation to collaborators


      Jan 13, 2023

    

  












  
  

    

      

  





  




  
  

             

  
      Sign up for free
      to subscribe to this conversation on GitHub.
      Already have an account?
      Sign in.


  


  






  
                    




    

  


      
  

    Assignees
  



        

    No one assigned







      


  


  

    Labels
  



    

      

    enhancement: pending triage









      

  

    

        

    Projects
  


        




    None yet




  



      


  

    
  

    Milestone
  


      No milestone





    
      
          
  

    

      

        
          

            
    

    Development
  




              
    
No branches or pull requests







        
      

    

  


      

    

  
      

  

    

      4 participants
    

    

        
          @Shinigami92 
        
          @wyhaya 
        
          @anncwb 
        
          @bluwy