Can't compile assets

[nicolafan]

Hi! After setting up a new installation using Homestead 13.2 everything looks good, but it results impossible to me to compile assets (I would like to make changes to Vue code of my testing installation). The following is the walkthrough of all the issues (in case you could help me understand the real problem) I encounter after running npm install && npm run production (same for npm run development):

1. I get:

   ERROR in ./resources/assets/js/components/presenter/VideoPresenter.vue 1:0
   Module parse failed: Unexpected token (1:0)
   You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See        https://webpack.js.org/concepts#loaders
   > <template>
   |       <div v-if="status.sensitive == true" class="content-label-wrapper">
   |               <div class="text-light content-label">
   

   This error is repeated for many Vue files. I solve this by adding .vue() to webpack.mix.js.

2. npm run production now works. I navigate to https://pixelfed.test/i/web and get the same error as in #3247. Mix can't load spa.js and spa.css because they are not in webpack.mix.js. I solve this (probably erroneously) by using asset('js/spa.js') and asset('css/spa.css') in layouts/spa.blade.php. After that, the problem is solved but the entire screen of https://pixelfed.test/i/web is black.

3. If I use the classic UI (https://pixelfed.test/) this is what I get:

   

   The console prints out:

   After changing the first line of resources/assets/js/components.js from window.Vue = require('vue'); to window.Vue = require('vue').default; and re-running npm run production, I get:

   

   (No console error but still no icons). Tried Chrome and Firefox. I got this problem with v. 0.11.3 and v. 0.11.2. I can compile in v. 0.11.1.

These are all the things I tried but I wasn't able to understand the problem. I'm sorry if I'm missing something obvious. I can provide additional information if required. Thank you so much!

[dansup]

Hello, sorry about that! We're in the middle of a huge refactor, and hope to resolve our asset pipeline issues soon.

[zealov]

您好，对此感到抱歉！我们正在进行大规模的重构，并希望尽快解决我们的资产管道问题。 大概需要多久这个问题可以解决呀

[zealov]

大概需要多久这个问题可以解决呀

[ballerburg9005]

Dang! I was about to make a small PR out of nowhere but had a hard time testing my changes. Thanks for the issue.

[motzmose]

Hey there! Love the project. Are there any news on this issue or any tips on how to proceed when trying to edit the Vue code? Thanks in advance!

[nicolafan]

Hi! Just an update concerning the icons... If you recompile assets and lose them change the fontawesome classes of the icons in the corresponding files from fal (I don't remember very well but I think it was fal), to fas.

I think that fontawesome light icons are only available for Pro users.

[motzmose]

Hey! Thanks for the quick response! I think my only option is to somehow rollback to a state (as you stated 0.11.1 doesn't have that problem) where I can still make changes. I can confirm however that changing fal to fas brings back the icons. Have good start into the week y'all!

[M-Miller-42]

I would be very thankful for a hint on how the public/spa.js is generated. It is updated regularly for newer versions, but it seems some code for that is not yet checked in. Could it be described/posted here in the meantime as a workaround?

[stigger]

I've been looking for the sources of the processed javascript code as well.

[DoM1niC]

I got

Module not found: Error: Can't resolve './partials/RegisterForm.vue' in '/home/www/projects/other/pixelfed/resources/assets/components/remote-auth'
Did you miss the leading dot in 'resolve.extensions'? Did you mean '[".*",".wasm",".mjs",".js",".jsx",".json",".vue"]' instead of '["*",".wasm",".mjs",".js",".jsx",".json",".vue"]'?

webpack compiled with 1 error

[mitexleo]

I got

Module not found: Error: Can't resolve './partials/RegisterForm.vue' in '/home/www/projects/other/pixelfed/resources/assets/components/remote-auth'
Did you miss the leading dot in 'resolve.extensions'? Did you mean '[".*",".wasm",".mjs",".js",".jsx",".json",".vue"]' instead of '["*",".wasm",".mjs",".js",".jsx",".json",".vue"]'?

webpack compiled with 1 error

Known issue. @dansup will fix it soon.

[mbliznikova]

@mitexleo Hi! Is it fixed yet? Can you recommend a way to fix it on my local machine? I want to try to learn developing for pixelfed, and hopefully contribute some bug fixes, but this prevents me from moving forward.

[motzmose]

Yup, has been fixed. See #4464 and #4465 for details.