Problem z exportowaniem plików js

Problem z exportowaniem plików js
MK
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 93
0

Mam następujący problem. Wpisuję komendę webpack script-1.js ./bundle.js w celu przekształcenia 2 plików js w jeden. Gdy wchodzę w plik bundle.js jest on pusty, a nie powinien być. Będę wdzięczny za pomoc. Pojawia się następujący komunikat:

Kopiuj
asset main.js 288 bytes [compared for emit] [minimized] (name: main)
runtime modules 123 bytes 1 module
modules by path ./node_modules/*.js 91 bytes
  ./node_modules/script-1.js 57 bytes [built] [code generated]
  ./node_modules/script-2.js 34 bytes [built] [code generated]
./bundle.js 1 bytes [built] [code generated]

LOG from webpack.FileSystemInfo
<w> Managed item C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\script-1.js isn't a directory or doesn't contain a package.json (see snapshot.managedPaths option)
<w> Managed item C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\script-2.js isn't a directory or doesn't contain a package.json (see snapshot.managedPaths option)
+ 10 hidden lines

WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value.
Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/      

webpack 5.99.9 compiled with 1 warning in 186 ms
MM
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 44
1

Kiedy uruchamiasz Webpacka z argumentami bez flag, traktuje on je wszystkie jako punkty wejściowe (entry points). Komenda: webpack script-1.js ./bundle.js
Problem z Twoim pierwszym podejściem polegał na tym, że webpack nie wiedział, który plik jest wejściem, a który wyjściem. Możesz mu to jawnie wskazać za pomocą odpowiednich flag.
Spróbuj:
webpack --entry ./script-1.js --output-path ./dist --output-filename bundle.js --mode development

Szybciej dostaniesz odpowiedź używając np chataGPT.

MK
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 93
0

Teraz mam taki komunikat:

Kopiuj
[webpack-cli] Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
 - configuration.module has an unknown property 'loaders'. These properties are valid:
   object { defaultRules?, exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, generator?, noParse?, parser?, rules?, strictExportPresence?, strictThisContextOnImports?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp? }
   -> Options affecting the normal modules (`NormalModuleFactory`).
   Did you mean module.rules or module.rules.*.use?
MM
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 44
0

Zmień w pliku webpack.config.js

module.loaders -> module.rules
loader: 'babel-loader' -> use: 'babel-loader'
Coś takiego:

Kopiuj

module: {
  rules: [
    {
      test: /\.js$/,
      use: 'babel-loader' 
    }
  ]
}
MK
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 93
0

Teraz coś z Babelem jest:

Kopiuj

ERROR in main
Module not found: Error: Can't resolve 'babel-loader' in 'C:\Users\kamil\Desktop\Net Ninja\webpack-playlist'
resolve 'babel-loader' in 'C:\Users\kamil\Desktop\Net Ninja\webpack-playlist'
  Parsed request is a module
  using description file: C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\package.json (relative path: .)
    resolve as module
      C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules doesn't exist or is not a directory
      looking for modules in C:\Users\kamil\Desktop\Net Ninja\node_modules
        single file module
          using description file: C:\Users\kamil\Desktop\Net Ninja\package.json (relative path: ./node_modules/babel-loader)
            no extension
              C:\Users\kamil\Desktop\Net Ninja\node_modules\babel-loader doesn't exist
            .js
              C:\Users\kamil\Desktop\Net Ninja\node_modules\babel-loader.js doesn't exist
        C:\Users\kamil\Desktop\Net Ninja\node_modules\babel-loader doesn't exist
      C:\Users\kamil\Desktop\node_modules doesn't exist or is not a directory
      C:\Users\kamil\node_modules doesn't exist or is not a directory
      C:\Users\node_modules doesn't exist or is not a directory
      C:\node_modules doesn't exist or is not a directory

ERROR in main
Module not found: Error: Can't resolve 'babel-loader' in 'C:\Users\kamil\Desktop\Net Ninja\webpack-playlist'
resolve 'babel-loader' in 'C:\Users\kamil\Desktop\Net Ninja\webpack-playlist'
  Parsed request is a module
  using description file: C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\package.json (relative path: .)
    resolve as module
      C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules doesn't exist or is not a directory
      looking for modules in C:\Users\kamil\Desktop\Net Ninja\node_modules
        single file module
          using description file: C:\Users\kamil\Desktop\Net Ninja\package.json (relative path: ./node_modules/babel-loader)
            no extension
              C:\Users\kamil\Desktop\Net Ninja\node_modules\babel-loader doesn't exist
            .js
              C:\Users\kamil\Desktop\Net Ninja\node_modules\babel-loader.js doesn't exist
        C:\Users\kamil\Desktop\Net Ninja\node_modules\babel-loader doesn't exist
      C:\Users\kamil\Desktop\node_modules doesn't exist or is not a directory
      C:\Users\kamil\node_modules doesn't exist or is not a directory
      C:\Users\node_modules doesn't exist or is not a directory
      C:\node_modules doesn't exist or is not a directory

webpack 5.99.9 compiled with 2 errors in 47 ms
MK
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 93
0

Teraz to:

Kopiuj
npm error code 1
npm error path C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\node-sass
npm error command failed
npm error command C:\WINDOWS\system32\cmd.exe /d /s /c node scripts/build.js
npm error Building: C:\Program Files\nodejs\node.exe C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm error gyp info it worked if it ends with ok
npm error gyp verb cli [
npm error gyp verb cli   'C:\\Program Files\\nodejs\\node.exe',
npm error gyp verb cli   'C:\\Users\\kamil\\Desktop\\Net Ninja\\webpack-playlist\\node_modules\\node-gyp\\bin\\node-gyp.js',
npm error gyp verb cli   'rebuild',
npm error gyp verb cli   '--verbose',
npm error gyp verb cli   '--libsass_ext=',
npm error gyp verb cli   '--libsass_cflags=',
npm error gyp verb cli   '--libsass_ldflags=',
npm error gyp verb cli   '--libsass_library='
npm error gyp verb cli ]
npm error gyp info using node-gyp@3.8.0
npm error gyp info using node@22.16.0 | win32 | x64
npm error gyp verb command rebuild []
npm error gyp verb command clean []
npm error gyp verb clean removing "build" directory
npm error gyp verb command configure []
npm error gyp verb check python checking for Python executable "python2" in the PATH
npm error gyp verb `which` failed Error: not found: python2
npm error gyp verb `which` failed     at getNotFoundError (C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\which\which.js:13:12)
npm error gyp verb `which` failed     at F (C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\which\which.js:68:19)
npm error gyp verb `which` failed     at E (C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\which\which.js:80:29)
npm error gyp verb `which` failed     at C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\which\which.js:89:16
npm error gyp verb `which` failed     at C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\isexe\index.js:42:5
npm error gyp verb `which` failed     at C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\isexe\windows.js:36:5
npm error gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21)
npm error gyp verb `which` failed  python2 Error: not found: python2
npm error gyp verb `which` failed     at getNotFoundError (C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\which\which.js:13:12)
npm error gyp verb `which` failed     at F (C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\which\which.js:68:19)
npm error gyp verb `which` failed     at E (C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\which\which.js:80:29)
npm error gyp verb `which` failed     at C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\which\which.js:89:16
npm error gyp verb `which` failed     at C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\isexe\index.js:42:5
npm error gyp verb `which` failed     at C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\isexe\windows.js:36:5
npm error gyp verb `which` failed     at FSReqCallback.oncomplete (node:fs:198:21) {
npm error gyp verb `which` failed   code: 'ENOENT'
npm error gyp verb `which` failed }
npm error gyp verb check python checking for Python executable "python" in the PATH
npm error gyp verb `which` succeeded python C:\Python313\python.EXE
npm error (node:6232) [DEP0060] DeprecationWarning: The `util._extend` API is deprecated. Please use Object.assign() instead.
npm error (Use `node --trace-deprecation ...` to show where the warning was created)
npm error gyp ERR! configure error
npm error gyp ERR! stack Error: Command failed: C:\Python313\python.EXE -c import sys; print "%s.%s.%s" % sys.version_info[:3];
npm error gyp ERR! stack   File "<string>", line 1
npm error gyp ERR! stack     import sys; print "%s.%s.%s" % sys.version_info[:3];
npm error gyp ERR! stack                 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
npm error gyp ERR! stack SyntaxError: Missing parentheses in call to 'print'. Did you mean print(...)?
npm error gyp ERR! stack
npm error gyp ERR! stack     at genericNodeError (node:internal/errors:983:15)
npm error gyp ERR! stack     at wrappedFn (node:internal/errors:537:14)
npm error gyp ERR! stack     at ChildProcess.exithandler (node:child_process:414:12)
npm error gyp ERR! stack     at ChildProcess.emit (node:events:518:28)
npm error gyp ERR! stack     at maybeClose (node:internal/child_process:1101:16)
npm error gyp ERR! stack     at ChildProcess._handle.onexit (node:internal/child_process:304:5)
npm error gyp ERR! System Windows_NT 10.0.26100
npm error gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\kamil\\Desktop\\Net Ninja\\webpack-playlist\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm error gyp ERR! cwd C:\Users\kamil\Desktop\Net Ninja\webpack-playlist\node_modules\node-sass
npm error gyp ERR! node -v v22.16.0
npm error gyp ERR! node-gyp -v v3.8.0
npm error gyp ERR! not ok
npm error Build failed with error code: 1
npm error A complete log of this run can be found in: C:\Users\kamil\AppData\Local\npm-cache\_logs\2025-06-17T14_31_38_902Z-debug-0.log

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.