在 webpack 中使用 node-loader 安装“sharp”模块出现问题

Posted

技术标签:

【中文标题】在 webpack 中使用 node-loader 安装“sharp”模块出现问题【英文标题】：Something went wrong installing the "sharp" module, using node-loader in webpack 【发布时间】：2021-04-11 14:07:50 【问题描述】：

我将sharp 和webpack 与node-loader 一起使用，但出现此错误：

D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:150011
  throw new Error(error);
  ^

Error:
Something went wrong installing the "sharp" module

node-loader:
Error: The specified module could not be found.
D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server/33c1e48f049ce3285905e286d212a201.node

- Remove the "node_modules/sharp" directory then run
  "npm install --ignore-scripts=false --verbose" and look for errors
- Consult the installation documentation at https://sharp.pixelplumbing.com/install
- Search for this error at https://github.com/lovell/sharp/issues

    at Object.EmBj (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:150011:9)
    at __webpack_require__ (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:27:30)
    at Object.Tbcg (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:251632:15)
    at __webpack_require__ (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:27:30)
    at Module.dMKD (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:324313:63)
    at __webpack_require__ (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:27:30)
    at Module.mWHM (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:405859:77)
    at __webpack_require__ (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:27:30)
    at Module.WXK/ (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:271250:65)
    at __webpack_require__ (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:27:30)
    at D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:118:18
    at Object.<anonymous> (D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\dist\cms\core\server\express.js:121:10)
←[90m    at Module._compile (internal/modules/cjs/loader.js:1156:30)←[39m
←[90m    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)←[39m
←[90m    at Module.load (internal/modules/cjs/loader.js:1000:32)←[39m
←[90m    at Function.Module._load (internal/modules/cjs/loader.js:899:14)←[39m
←[90m    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12)←[39m
←[90m    at internal/main/run_main_module.js:18:47←[39m

我从“node_modules”中删除了sharp，然后重新安装了它，但得到了同样的错误

> npm cache clean -f
> npm i --verbose sharp@latest

安装sharp的详细输出是：


D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx>npm i --verbose sharp@latest
npm info it worked if it ends with ok
npm verb cli [
npm verb cli   'C:\\Program Files\\nodejs\\node.exe',
npm verb cli   'C:\\Users\\eldeeb\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js',
npm verb cli   'i',
npm verb cli   '--verbose',
npm verb cli   'sharp@latest'
npm verb cli ]
npm info using npm@6.9.0
npm info using node@v12.16.2
npm verb npm-session c41d87c77d3d7180
npm http fetch GET 200 https://registry.npmjs.org/sharp 1417ms
npm http fetch GET 200 https://registry.npmjs.org/sharp/-/sharp-0.27.0.tgz 644ms
npm timing stage:loadCurrentTree Completed in 6364ms
npm timing stage:loadIdealTree:cloneCurrentTree Completed in 37ms
npm timing stage:loadIdealTree:loadShrinkwrap Completed in 1936ms
npm http fetch GET 200 https://registry.npmjs.org/array-flatten 218ms
npm http fetch GET 200 https://registry.npmjs.org/array-flatten/-/array-flatten-3.0.0.tgz 278ms
npm http fetch GET 200 https://registry.npmjs.org/prebuild-install 507ms
npm http fetch GET 200 https://registry.npmjs.org/npmlog 511ms
npm http fetch GET 200 https://registry.npmjs.org/simple-get 545ms
npm http fetch GET 200 https://registry.npmjs.org/tar-fs 638ms
npm http fetch GET 200 https://registry.npmjs.org/semver 643ms
npm http fetch GET 200 https://registry.npmjs.org/node-addon-api 654ms
npm http fetch GET 200 https://registry.npmjs.org/detect-libc 659ms
npm http fetch GET 200 https://registry.npmjs.org/prebuild-install/-/prebuild-install-6.0.0.tgz 156ms
npm http fetch GET 200 https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz 158ms
npm http fetch GET 200 https://registry.npmjs.org/simple-get/-/simple-get-4.0.0.tgz 151ms
npm http fetch GET 200 https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.1.tgz 468ms
npm http fetch GET 200 https://registry.npmjs.org/semver/-/semver-7.3.4.tgz 471ms
npm http fetch GET 200 https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz 464ms
npm http fetch GET 200 https://registry.npmjs.org/node-addon-api/-/node-addon-api-3.1.0.tgz 644ms
npm http fetch GET 200 https://registry.npmjs.org/are-we-there-yet 122ms
npm http fetch GET 200 https://registry.npmjs.org/gauge 306ms
npm http fetch GET 200 https://registry.npmjs.org/console-control-strings 319ms
npm http fetch GET 200 https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz 424ms
npm http fetch GET 200 https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz 436ms
npm http fetch GET 200 https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz 626ms
npm http fetch GET 200 https://registry.npmjs.org/delegates 182ms
npm http fetch GET 200 https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz 355ms
npm http fetch GET 200 https://registry.npmjs.org/has-unicode 150ms
npm http fetch GET 200 https://registry.npmjs.org/wide-align 158ms
npm http fetch GET 200 https://registry.npmjs.org/strip-ansi 166ms
npm http fetch GET 200 https://registry.npmjs.org/string-width 170ms
npm http fetch GET 200 https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz 216ms
npm http fetch GET 200 https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz 232ms
npm http fetch GET 200 https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz 242ms
npm http fetch GET 200 https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz 323ms
npm http fetch GET 200 https://registry.npmjs.org/code-point-at 248ms
npm http fetch GET 200 https://registry.npmjs.org/is-fullwidth-code-point 260ms
npm http fetch GET 200 https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz 335ms
npm http fetch GET 200 https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz 364ms
npm http fetch GET 200 https://registry.npmjs.org/number-is-nan 221ms
npm http fetch GET 200 https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz 198ms
npm http fetch GET 200 https://registry.npmjs.org/ansi-regex 294ms
npm http fetch GET 200 https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz 235ms
npm http fetch GET 200 https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz 129ms
npm http fetch GET 200 https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz 659ms
npm http fetch GET 200 https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz 673ms
npm http fetch GET 200 https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz 167ms
npm http fetch GET 200 https://registry.npmjs.org/expand-template 196ms
npm http fetch GET 200 https://registry.npmjs.org/which-pm-runs 441ms
npm http fetch GET 200 https://registry.npmjs.org/noop-logger 445ms
npm http fetch GET 200 https://registry.npmjs.org/node-abi 449ms
npm http fetch GET 200 https://registry.npmjs.org/napi-build-utils 456ms
npm http fetch GET 200 https://registry.npmjs.org/simple-get/-/simple-get-3.1.0.tgz 448ms
npm http fetch GET 200 https://registry.npmjs.org/expand-template/-/expand-template-2.0.3.tgz 263ms
npm http fetch GET 200 https://registry.npmjs.org/mkdirp-classic 473ms
npm http fetch GET 200 https://registry.npmjs.org/github-from-package 479ms
npm http fetch GET 200 https://registry.npmjs.org/mkdirp-classic/-/mkdirp-classic-0.5.3.tgz 549ms
npm http fetch GET 200 https://registry.npmjs.org/node-abi/-/node-abi-2.19.3.tgz 557ms
npm http fetch GET 200 https://registry.npmjs.org/noop-logger/-/noop-logger-0.1.1.tgz 575ms
npm http fetch GET 200 https://registry.npmjs.org/which-pm-runs/-/which-pm-runs-1.0.0.tgz 580ms
npm http fetch GET 200 https://registry.npmjs.org/github-from-package/-/github-from-package-0.0.0.tgz 561ms
npm http fetch GET 200 https://registry.npmjs.org/napi-build-utils/-/napi-build-utils-1.0.2.tgz 571ms
npm http fetch GET 200 https://registry.npmjs.org/semver/-/semver-5.7.1.tgz 336ms
npm http fetch GET 200 https://registry.npmjs.org/simple-concat 280ms
npm http fetch GET 200 https://registry.npmjs.org/decompress-response 299ms
npm http fetch GET 200 https://registry.npmjs.org/simple-concat/-/simple-concat-1.0.1.tgz 131ms
npm http fetch GET 200 https://registry.npmjs.org/decompress-response/-/decompress-response-4.2.1.tgz 147ms
npm http fetch GET 200 https://registry.npmjs.org/mimic-response 213ms
npm http fetch GET 200 https://registry.npmjs.org/mimic-response/-/mimic-response-2.1.0.tgz 183ms
npm http fetch GET 200 https://registry.npmjs.org/tar-stream 206ms
npm http fetch GET 200 https://registry.npmjs.org/tar-stream/-/tar-stream-2.2.0.tgz 293ms
npm http fetch GET 200 https://registry.npmjs.org/fs-constants 162ms
npm http fetch GET 200 https://registry.npmjs.org/bl 202ms
npm http fetch GET 200 https://registry.npmjs.org/readable-stream 228ms
npm http fetch GET 200 https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz 188ms
npm http fetch GET 200 https://registry.npmjs.org/bl/-/bl-4.0.3.tgz 157ms
npm http fetch GET 200 https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz 154ms
npm http fetch GET 200 https://registry.npmjs.org/buffer 858ms
npm http fetch GET 200 https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz 159ms
npm http fetch GET 200 https://registry.npmjs.org/decompress-response/-/decompress-response-6.0.0.tgz 245ms
npm http fetch GET 200 https://registry.npmjs.org/mimic-response/-/mimic-response-3.1.0.tgz 105ms
npm timing stage:loadIdealTree:loadAllDepsIntoIdealTree Completed in 17386ms
npm timing stage:loadIdealTree Completed in 20212ms
npm timing stage:generateActionsToTake Completed in 251ms
npm verb correctMkdir C:\Users\eldeeb\AppData\Roaming\npm-cache\_locks correctMkdir not in flight; initializing
npm verb makeDirectory C:\Users\eldeeb\AppData\Roaming\npm-cache\_locks creation not in flight; initializing
npm verb makeCacheDir UID & GID are irrelevant on win32
npm verb lock using C:\Users\eldeeb\AppData\Roaming\npm-cache\_locks\staging-ff976866a950c511.lock for D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\node_modules\.stag
ing
npm http fetch GET 200 https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz 250ms
npm http fetch GET 200 https://registry.npmjs.org/fsevents/-/fsevents-2.1.3.tgz 260ms
npm http fetch GET 200 https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz 255ms
npm timing action:extract Completed in 304ms
npm info lifecycle undefined~preuninstall: undefined
npm info lifecycle undefined~uninstall: undefined
npm timing action:unbuild Completed in 10ms
npm timing action:remove Completed in 0ms
npm timing action:finalize Completed in 60ms
npm timing action:refresh-package-json Completed in 105ms
npm info lifecycle array-flatten@3.0.0~preinstall: array-flatten@3.0.0
npm info lifecycle semver@7.3.4~preinstall: semver@7.3.4
npm info lifecycle sharp@0.27.0~preinstall: sharp@0.27.0
npm timing action:preinstall Completed in 17ms
npm info linkStuff array-flatten@3.0.0
npm info linkStuff semver@7.3.4
npm verb linkBins [
npm verb linkBins    semver: 'bin/semver.js' ,
npm verb linkBins   'D:\\Downloads\\__projects\\dev\\NodeJs\\@eng-dibo\\ngx\\node_modules\\sharp\\node_modules\\.bin',
npm verb linkBins   false
npm verb linkBins ]
npm info linkStuff sharp@0.27.0
npm timing action:build Completed in 70ms
npm info lifecycle array-flatten@3.0.0~install: array-flatten@3.0.0
npm info lifecycle semver@7.3.4~install: semver@7.3.4
npm info lifecycle sharp@0.27.0~install: sharp@0.27.0

> sharp@0.27.0 install D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\node_modules\sharp
> (node install/libvips && node install/dll-copy && prebuild-install) || (node-gyp rebuild && node install/dll-copy)

info sharp Downloading https://github.com/lovell/sharp-libvips/releases/download/v8.10.5/libvips-8.10.5-win32-x64.tar.br
info sharp Creating D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\node_modules\sharp\build\Release
info sharp Copying DLLs from D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\node_modules\sharp\vendor\8.10.5\lib to D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\nod
e_modules\sharp\build\Release
prebuild-install info begin Prebuild-install version 6.0.0
prebuild-install info looking for cached prebuild @ C:\Users\eldeeb\AppData\Roaming\npm-cache\_prebuilds\9cc5aa-sharp-v0.27.0-napi-v3-win32-x64.tar.gz
prebuild-install info found cached prebuild
prebuild-install info unpacking @ C:\Users\eldeeb\AppData\Roaming\npm-cache\_prebuilds\9cc5aa-sharp-v0.27.0-napi-v3-win32-x64.tar.gz
prebuild-install info unpack resolved to D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\node_modules\sharp\build\Release\sharp.node
prebuild-install info install Successfully installed prebuilt binary!
npm verb lifecycle sharp@0.27.0~install: unsafe-perm in lifecycle true
npm verb lifecycle sharp@0.27.0~install: PATH: C:\Users\eldeeb\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;D:\Downloads\__projects\dev\No
deJs\@eng-dibo\ngx\node_modules\sharp\node_modules\.bin;D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\node_modules\.bin;C:\Program Files (x86)\Intel\iCLS Client\;C:\Pr
ogram Files\Intel\iCLS Client\;C:\ProgramData\Oracle\Java\javapath;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\
Program Files (x86)\WinMerge;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;C:\Program
Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files (x86)\Skype\Phone\;C:\
Program Files\Microsoft SQL Server\110\Tools\Binn\;C:\Program Files (x86)\QuickTime\QTSystem\;C:\Program Files\Git\cmd;C:\Program Files\nodejs\;C:\Program Files (x86)\Yar
n\bin\;C:\Program Files\heroku\bin;C:\Users\eldeeb\AppData\Roaming\npm;C:\Users\eldeeb\AppData\Local\atom\bin;C:\Users\eldeeb\AppData\Local\Yarn\bin
npm verb lifecycle sharp@0.27.0~install: CWD: D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\node_modules\sharp
npm timing audit submit Completed in 6102ms
npm http fetch POST 200 https://registry.npmjs.org/-/npm/v1/security/audits/quick 6102ms
npm timing audit body Completed in 1ms
npm timing action:install Completed in 30506ms
npm info lifecycle array-flatten@3.0.0~postinstall: array-flatten@3.0.0
npm info lifecycle semver@7.3.4~postinstall: semver@7.3.4
npm info lifecycle sharp@0.27.0~postinstall: sharp@0.27.0
npm timing action:postinstall Completed in 9ms
npm verb unlock done using C:\Users\eldeeb\AppData\Roaming\npm-cache\_locks\staging-ff976866a950c511.lock for D:\Downloads\__projects\dev\NodeJs\@eng-dibo\ngx\node_module
s\.staging
npm timing stage:executeActions Completed in 31157ms
npm timing stage:rollbackFailedOptional Completed in 19ms
npm timing stage:runTopLevelLifecycles Completed in 58678ms
npm verb saving [  name: 'sharp', spec: '^0.27.0', save: 'dependencies'  ]
npm verb shrinkwrap skipping write for package.json because there were no changes.
npm info lifecycle undefined~preshrinkwrap: undefined
npm info lifecycle undefined~shrinkwrap: undefined
npm verb shrinkwrap skipping write for package-lock.json because there were no changes.
npm info lifecycle undefined~postshrinkwrap: undefined
npm WARN @angular-devkit/build-angular@0.1001.7 requires a peer of @angular/localize@^10.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @angular-devkit/build-angular@0.1001.7 requires a peer of ng-packagr@^10.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @fortawesome/angular-fontawesome@0.6.1 requires a peer of @angular/core@^9.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @fortawesome/angular-fontawesome@0.6.1 requires a peer of tslib@^1.10.0 but none is installed. You must install peer dependencies yourself.
npm WARN jsdom@16.4.0 requires a peer of canvas@^2.5.0 but none is installed. You must install peer dependencies yourself.
npm WARN ngx-loading@8.0.0 requires a peer of @angular/common@^8.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN ngx-loading@8.0.0 requires a peer of @angular/core@^8.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN sass-loader@10.0.1 requires a peer of node-sass@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN sass-loader@10.0.1 requires a peer of fibers@>= 3.1.0 but none is installed. You must install peer dependencies yourself.
npm WARN webpack-subresource-integrity@1.4.1 requires a peer of html-webpack-plugin@^2.21.0 || ~3 || >=4.0.0-alpha.2 <5 but none is installed. You must install peer depen
dencies yourself.
npm WARN ws@7.4.0 requires a peer of bufferutil@^4.0.1 but none is installed. You must install peer dependencies yourself.
npm WARN ws@7.4.0 requires a peer of utf-8-validate@^5.0.2 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules\webpack-dev-server\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted "os":"darwin","arch":"any" (current: "os":"win32","arch":"x64")
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Valid OS:    darwin
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Valid Arch:  any
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Actual OS:   win32
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Actual Arch: x64
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.1.3 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.1.3: wanted "os":"darwin","arch":"any" (current: "os":"win32","arch":"x64")
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Valid OS:    darwin
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Valid Arch:  any
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Actual OS:   win32
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Actual Arch: x64
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules\watchpack-chokidar2\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted "os":"darwin","arch":"any" (current: "os":"win32","arch":"x64")
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Valid OS:    darwin
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Valid Arch:  any
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Actual OS:   win32
npm verb notsup SKIPPING OPTIONAL DEPENDENCY: Actual Arch: x64

+ sharp@0.27.0
added 3 packages from 69 contributors and audited 1986 packages in 60.317s
found 11 vulnerabilities (7 low, 1 moderate, 3 high)
  run `npm audit fix` to fix them, or `npm audit` for details
npm verb exit [ 0, true ]
npm timing npm Completed in 60904ms
npm info ok

我在 webpack 中添加了node-loader：

config.module.rules.push(
     test: /\.ts$/, loader: "ts-loader" ,
    
      test: /\.node$/,
      use: "node-loader"
    
  );

操作系统：Windows 8.1

这个问题特别出现在 Angular 中，我刚刚创建了一个全新的 Angular 项目并启用了通用应用程序。

最小复制：

https://github.com/eng-dibo/ng-sharp-issue

运行此复制的步骤：

1- 克隆这个 repo https://github.com/eng-dibo/ng-sharp-issue

2- inatsll 包npm i

3-搭建服务器npm run build:server:dev

-> 可选 构建整个项目（浏览器和服务器）并提供服务npm run start

-> 脚本 build:s-s-r 已重命名为 build:server 或 build:server:dev 以进行澄清。

这会生成 dist 目录，其中包含 main.js 和 sharp-*.node 文件

4- 运行服务器node dist/main

Error:
Something went wrong installing the "sharp" module

node-loader:
Error: The specified module could not be found.
//sharp-ac5709806d227d1d966f7f0b76814d78.node

如果我们从 webpack 配置中删除 node-loader，我们将得到 error: Unexpected character '�' (1:2)，如以下详细的“创建此 repo 的步骤”中所述。

制作此复制品的步骤：（供参考）

1- 创建新的 Angular 项目：

ng new ngx
ng serve -o //<-- success

2- 启用通用应用

ng add @nguniversal/express-engine
npm run build:s-s-r & npm run serve <--success

3- 给server.ts加尖

//server.ts
import * as sharp from "sharp"
sharp('./image.jpg')

npm run build:s-s-r <-- faild, error: Unexpected character '�' (1:2)

4-使用node-loader加载.node文件（在sharp包内），我们需要使用自定义webpack来修改Angular中的webpack配置

npm i -D @angular-builders/custom-webpack node-loader ts-loader

//angular.json

...
server:
  "builder": "@angular-builders/custom-webpack:server",
   "options": 
            "customWebpackConfig": 
              "path": "./webpack.server.config.js"
            
  




//webpack.server.config.js (simplified)
module.exports = (config, options) => 
   //remove webpack config from Angular, except 'resolve', and add rules (ts-loader, node-loader)

config = 
    mode: "development",
    resolve: config.resolve,
    entry: 
      main: ["./server.ts"]
    ,
    target: "node",
    stats:  colors: false ,
    module: 
      rules: [
         test: /\.ts$/, loader: "ts-loader" ,
        
          test: /\.node$/,
          loader: "node-loader",
          options:  name: "[name]-[contenthash].[ext]" 
        
      ]
    
  ;

return config;




npm run build:s-s-r <-- faild

【问题讨论】：

【参考方案1】：

删除“node_modules”中的“sharp”目录，然后运行 “npm install --ignore-scripts=false --verbose sharp” 应该可以完美运行

【讨论】：

【参考方案2】：

【解决方案】问题已解决，是因为'node-externals'模块解析'package.json'的路径错误。

它假定文件 package.json 位于当前工作目录“CWD”的同一目录中，但它可能不像我的情况（monorepo）。

简而言之： 如果您从其他目录而不是项目的根目录（例如工作空间根目录）运行构建命令，node-externals 插件将使用您的工作空间根目录（即：CWD）中的 package.json 文件，该文件不包含 'sharp '，所以它不会将它添加到 webpack.external[]

【讨论】：

也有 monorepo 设置。让我发狂。尝试options.additionalModuleDirs (='[]') 选项。应该工作

以上是关于在 webpack 中使用 node-loader 安装“sharp”模块出现问题的主要内容，如果未能解决你的问题，请参考以下文章

(23/24) webpack实战技巧：如何在webpack环境中使用Json

css 中使用webpack别名(alias)

如何在 Webpack 配置中使用 __webpack_public_path__ 变量？

webpack 4.x 解决 webpack-dev-server工具在webpack构建的项目中使用问题

使用 webpack 在浏览器中使用 require 模块

在 webpack 中使用 ECharts