quasarframework / quasar

Quasar Framework - Build high-performance VueJS user interfaces in record time
https://quasar.dev
MIT License
25.72k stars 3.49k forks source link

Building capacitor modifies package.json #16808

Open teodor-safeex opened 7 months ago

teodor-safeex commented 7 months ago

What happened?

Building capacitor modifies src-capacitor/package.json -> it removes the empty line at the end of the file.

This does not seem to behave the same way for the SPA application.

And even more weirdly, when run locally, if @jcesarmobile/ssl-skip is present, the build will remove it and keep the empty line at the end of the file. BUT if we try to build it again, it would then remove the empty line.

What did you expect to happen?

Building the capacitor app should not modify src-capacitor/package.json

Reproduction URL

https://stackblitz.com/edit/quasarframework-webpack-llippr?file=src-capacitor%2Fpackage.json,README.md

How to reproduce?

  1. Install any capacitor package, lets say @jcesarmobile/ssl-skip
  2. See that src-capacitor/package.json has an empty line at the end (You can also manually add an empty line)
  3. Build the capacitor app -> quasar build -m capacitor -T android -s -d
  4. See that src-capacitor/package.json is now missing the empty line

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Quasar CLI Commands/Configuration (@quasar/cli | @quasar/app-webpack | @quasar/app-vite), Capacitor Mode

Platforms/Browsers

No response

Quasar info output

Reproduction URL output

Operating System - Linux(5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36) - linux/x64
NodeJs - 18.18.0

Global packages
  NPM - 10.2.3
  yarn - 1.22.19
  @quasar/cli - undefined
  @quasar/icongenie - Not installed
  cordova - Not installed

Important local packages
  quasar - 2.6.2 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-webpack - 3.4.7 -- Quasar Framework App CLI with Webpack
  @quasar/extras - 1.13.4 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.2.31 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.0.14
  pinia - Not installed
  vuex - Not installed
  electron - Not installed
  electron-packager - Not installed
  electron-builder - Not installed
  @babel/core - 7.17.8 -- Babel compiler core.
  webpack - 5.70.0 -- Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, ... and your custom stuff.
  webpack-dev-server - 4.7.4 -- Serves a webpack app. Updates the browser on changes.
  workbox-webpack-plugin - Not installed
  register-service-worker - 1.7.2 -- Script for registering service worker, with hooks
  typescript - 4.5.5 -- TypeScript is a language for application scale JavaScript development
  @capacitor/core - 2.5.0 -- Capacitor: cross-platform mobile apps with the web
  @capacitor/cli - 2.5.0 -- Capacitor: Cross-platform apps with JavaScript and the web
  @capacitor/android - 2.5.0 -- Capacitor: cross-platform mobile apps with the web
  @capacitor/ios - Not installed

Quasar App Extensions
  *None installed*

Networking
  Host - quasarframeworkwebpackllippr-kntm
  en0 - 192.168.1.104

Local output

Operating System - Linux(6.5.0-14-generic) - linux/x64
NodeJs - 18.19.0

Global packages
  NPM - 10.2.3
  yarn - Not installed
  @quasar/cli - 2.3.0
  @quasar/icongenie - 3.1.1
  cordova - Not installed

Important local packages
  quasar - 2.14.2 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-webpack - 3.12.3 -- Quasar Framework App CLI with Webpack
  @quasar/extras - 1.16.9 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.4.15 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.1.5
  pinia - 2.1.7 -- Intuitive, type safe and flexible Store for Vue
  vuex - Not installed
  electron - 25.9.5 -- Build cross platform desktop apps with JavaScript, HTML, and CSS
  electron-packager - 15.5.2 -- Customize and package your Electron app with OS-specific bundles (.app, .exe, etc.) via JS or CLI
  electron-builder - Not installed
  @babel/core - 7.22.5 -- Babel compiler core.
  webpack - 5.88.0 -- Packs ECMAScript/CommonJs/AMD modules for the browser. Allows you to split your codebase into multiple bundles, which can be loaded on demand. Supports loaders to preprocess files, i.e. json, jsx, es7, css, less, ... and your custom stuff.
  webpack-dev-server - 4.11.1 -- Serves a webpack app. Updates the browser on changes.
  workbox-webpack-plugin - Not installed
  register-service-worker - 1.7.2 -- Script for registering service worker, with hooks
  typescript - 4.9.4 -- TypeScript is a language for application scale JavaScript development
  @capacitor/core - 5.6.0 -- Capacitor: Cross-platform apps with JavaScript and the web
  @capacitor/cli - 5.6.0 -- Capacitor: Cross-platform apps with JavaScript and the web
  @capacitor/android - 5.6.0 -- Capacitor: Cross-platform apps with JavaScript and the web
  @capacitor/ios - Not installed

Quasar App Extensions
  @quasar/quasar-app-extension-testing-unit-jest - 3.0.0-beta.7 -- A Quasar App Extension for running Jest tests

Networking
  Host - dev
  wlo1 - 192.168.14.16

Relevant log output

No response

Additional context

I haven't look into the actual code so I am not sure how relevant webpack/vite is to the capacitor build, but this happens with both vite and webpack.

Quasar internally adds and removes @jcesarmobile/ssl-skip. This is problematic because the whole install/removal is one of the cases in which the file is modified and can cause the removal of the empty line at the end of the package.json.

I firmly believe Quasar should instead give a warning if @jcesarmobile/ssl-skip is present during builds, have an option to skip this and let developers deal with it themselves, or at the very least make sure it manually add an empty line, so that there are no semantic modifications.

This is problematic if you want to do a git diff to see if there are any changes done to the code. While you can ignore whitespaces with git diff --ignore-space-at-eol, this should be fixed so it behaves similarly to the other modes.

ddenev commented 1 month ago

I agree that this is a somehow annoying behaviour - every time we switch from dev to prod build (and vice versa), we end up with an updated package.json and yarn.lock files that mess with the tracked project changes.

In addition, Quasar adds ssl-skip v0.2.0 while there is newer version - v0.4.0 which is updated for Capacitor v6.

@rstoenescu , allow me to bump this report into your radar (I apologize if you are already aware of it).