NativeScript / NativeScript/nativescript-cli

Upgrade app from NS7 to NS8 getting a ton of errors from web pack

オープン
#5,539 コメント 14 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

主要言語
JavaScript
スター
1.1k
フォーク
204
平均マージ
1日 9時間
マージ済み PR(30日)
8

説明

Mac OS Catalina 10.15.7
NS 8.0.3
Xcode 12.4

Plugins

Dependencies:

@nativescript/core ~8.0.0
@proplugins/nativescript-drop-down ^9.0.2
nativescript-intl ^4.0.2 │
nativescript-iqkeyboardmanager 1.5.1
nativescript-ui-dataform 5.0.0
nativescript-ui-listview 7.0.0

Dev Dependencies:

@nativescript/ios 8.0.0
@nativescript/webpack ~5.0.0-beta.0

NS Doctor

No issues were detected.
✔ Your ANDROID_HOME environment variable is set and points to correct directory.
✔ Your adb from the Android SDK is correctly installed.
✔ The Android SDK is installed.
✔ A compatible Android SDK for compilation is found.
✔ Javac is installed and is configured properly.
✔ The Java Development Kit (JDK) is installed and is configured properly.
✔ Xcode is installed and is configured properly.
✔ xcodeproj is installed and is configured properly.
✔ CocoaPods are installed.
✔ CocoaPods update is not required.
✔ CocoaPods are configured properly.
✔ Your current CocoaPods version is newer than 1.0.0.
✔ Python installed and configured correctly.
✔ The Python 'six' package is found.
✔ Xcode version 12.4.0 satisfies minimum required version 10.
✔ Getting NativeScript components versions information...
✔ Component nativescript has 8.0.2 version and is up to date.
✔ Component @nativescript/core has 8.0.7 version and is up to date.
✔ Component @nativescript/ios has 8.0.0 version and is up to date.
✖ Component @nativescript/android is not installed.

Upgrade an app from NS7 to NS8 and ran in to a ton of problems.

webpack 5.38.1 compiled with 1355 errors and 754 warnings in 137099 ms
Webpack compilation complete. Watching for file changes.
Updating runtime package.json with configuration values...

Errors such as

WARNING in ./node_modules/memfs/lib/process.js 20:15-33
Module not found: Error: Can't resolve 'process' in '/Users/nick/Documents/NativeScript/Projects/WFSL/node_modules/memfs/lib'
Did you mean './process'?
Requests that should resolve in the current directory need to start with './'.
Requests that start with a name are treated as module requests and resolve within module directories (/Users/nick/Documents/NativeScript/Projects/WFSL/node_modules, node_modules).
If changing the source code is not an option there is also a resolve options called 'preferRelative' which tries to resolve these kind of requests in the current directory too.

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
- add a fallback 'resolve.fallback: { "process": require.resolve("process/browser") }'
- install 'process'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "process": false }
@ .// sync .(xml|js|s?css)$ memfs/lib/process.js memfs/lib/process.js
@ ./@nativescript_webpack_virtual_entry_javascript 3:16-89

WARNING in ./node_modules/memfs/lib/volume.js 282:34-52
Module not found: Error: Can't resolve 'url' in '/Users/nick/Documents/NativeScript/Projects/WFSL/node_modules/memfs/lib'

ERROR in ./platforms/ios/build/Debug-iphonesimulator/WFSL.app/app/app/images/wfsl-logo.jpg 1:0
Module parse failed: Unexpected character '�' (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
(Source code omitted for this binary file)
@ ./platforms/ios/build/Debug-iphonesimulator/WFSL.app/app/ sync ^./.*$ ./app/images/wfsl-logo.jpg
@ ./platforms/ios/build/Debug-iphonesimulator/WFSL.app/app/runtime.js 553:27-73 562:25-72 1019:20-62
@ .// sync .(xml|js|s?css)$ ./platforms/ios/build/Debug-iphonesimulator/WFSL.app/app/runtime.js
@ ./@nativescript_webpack_virtual_entry_javascript 3:16-89

ERROR in ./platforms/ios/WFSL/app/platforms/ios/build/Debug-iphonesimulator/WFSL.app/app/node_modules/highlight.js/styles/pojoaque.jpg 1:0
Module parse failed: Unexpected character '�' (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
(Source code omitted for this binary file)
@ ./platforms/ios/WFSL/app/ sync ^./.*$ ./platforms/ios/build/Debug-iphonesimulator/WFSL.app/app/node_modules/highlight.js/styles/pojoaque.jpg
@ ./platforms/ios/WFSL/app/runtime.js 553:27-73 562:25-72 1019:20-62
@ .// sync .(xml|js|s?css)$ ./platforms/ios/WFSL/app/runtime.js
@ ./@nativescript_webpack_virtual_entry_javascript 3:16-89

ERROR in bundle
Module not found: Error: Can't resolve '/Users/nick/Documents/NativeScript/Projects/WFSL/app.js' in '/Users/nick/Documents/NativeScript/Projects/WFSL'

The above file is in the WFSL/app folder not under WFSL as indicated above why is this now an issue.

Cannot find any details regarding loaders for png or jpg files for Webpack.

I've done ns clean

webpack.config.js file is

`
const webpack = require("@nativescript/webpack");

 module.exports = (env) => {
        webpack.init(env);

        // Learn how to customize:
         // https://docs.nativescript.org/webpack

         return webpack.resolveConfig();

};
`

Why is upgrading NS version so problematic. NS5 to NS6 I had issues. NS6 to NS7 I had issues and now NS7 to NS8. There never appears to be a clean migration.

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

調査の方向性

webpack.config.js から始め、報告されている依存関係と app.js のパスを使って NS7-to-NS8 のビルドを再現します。memfs、image-loader、app.js について記載されている解決失敗を確認します。報告された webpack エラーなしで移行をビルドできれば完了です。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
javascript, webpack
領域
build-system, cli, mobile-dev
issue の種類
バグ
難易度
4/5
見積もり時間
3〜5日
活発さ
停滞
明瞭さ
説明が足りない
初心者へのやさしさ
18/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。