angularjs - Angular Summernote 不适用于 webpack?
问题描述
我们正在开发 AngularJs 1.5.10 版项目。现在我们想把它移到 Angular 5/6 版本。
该应用程序之前是使用 JHipster 构建的,但我们现在已经删除了 JHipster。
bower 的所有依赖项都已移至 package.json。
现在我们尝试使用 webpack 版本 4.26.1 捆绑脚本
在项目 summernote 版本中使用了 angular-summernote@0.8.1。但是现在当我们尝试运行 webpack 来创建捆绑的 JS 时,我们遇到了以下错误:
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade>npm run build
> library-app@0.0.0 build C:\MY_DRIVE\Projects\MyProject\AngularUpgrade
> rimraf src/main/webapp/dist && webpack --mode development --bail --progress --profile
70% building 66/72 modules 6 active ...de\node_modules\ng-file-upload\index.jsModuleNotFoundError: Module not found: Error: Can't resolve 'angular-summernote' in 'C:\MY_DRIVE\Projec
ts\MyProject\AngularUpgrade\src\main\webapp\app'
at factory.create (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\webpack\lib\Compilation.js:821:10)
at factory (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\webpack\lib\NormalModuleFactory.js:397:22)
at resolver (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\webpack\lib\NormalModuleFactory.js:130:21)
at asyncLib.parallel (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\webpack\lib\NormalModuleFactory.js:224:22)
at C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\neo-async\async.js:2825:7
at C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\neo-async\async.js:6886:13
at normalResolver.resolve (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\webpack\lib\NormalModuleFactory.js:214:25)
at doResolve (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:184:12)
at hook.callAsync (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:238:5)
at _fn0 (eval at create (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:15:1)
at resolver.doResolve (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\UnsafeCachePlugin.js:37:5)
at hook.callAsync (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:238:5)
at _fn0 (eval at create (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:15:1)
at hook.callAsync (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:238:5)
at _fn0 (eval at create (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:12:1)
at resolver.doResolve (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\DescriptionFilePlugin.js:42:38)
at hook.callAsync (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:238:5)
at _fn42 (eval at create (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:390:1)
at resolver.doResolve (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\ModuleKindPlugin.js:23:37)
at hook.callAsync (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:238:5)
at _fn0 (eval at create (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:15:1)
at hook.callAsync (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:238:5)
at _fn0 (eval at create (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:15:1)
at args (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\forEachBail.js:30:14)
at hook.callAsync (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:238:5)
at _fn0 (eval at create (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:15:1)
at resolver.doResolve (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\UnsafeCachePlugin.js:37:5)
at hook.callAsync (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:238:5)
at _fn0 (eval at create (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:15:1)
at hook.callAsync (C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\enhanced-resolve\lib\Resolver.js:238:5)
resolve 'angular-summernote' in 'C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\src\main\webapp\app'
Parsed request is a module
using description file: C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\package.json (relative path: ./src/main/webapp/app)
Field 'browser' doesn't contain a valid alias configuration
resolve as module
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\src\main\webapp\app\node_modules doesn't exist or is not a directory
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\src\main\webapp\node_modules doesn't exist or is not a directory
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\src\main\node_modules doesn't exist or is not a directory
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\src\node_modules doesn't exist or is not a directory
C:\MY_DRIVE\Projects\MyProject\node_modules doesn't exist or is not a directory
C:\MY_DRIVE\Projects\node_modules doesn't exist or is not a directory
C:\MY_DRIVE\node_modules doesn't exist or is not a directory
C:\node_modules doesn't exist or is not a directory
looking for modules in C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules
using description file: C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\package.json (relative path: ./node_modules)
Field 'browser' doesn't contain a valid alias configuration
using description file: C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote\package.json (relative path: .)
no extension
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote is not a file
.webpack.js
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote.webpack.js doesn't exist
.web.js
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote.web.js doesn't exist
.ts
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote.ts doesn't exist
.tsx
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote.tsx doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote.js doesn't exist
as directory
existing directory
using path: C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote\index
using description file: C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote\package.json (relative path: ./index)
no extension
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote\index doesn't exist
.webpack.js
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote\index.webpack.js doesn't exist
.web.js
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote\index.web.js doesn't exist
.ts
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote\index.ts doesn't exist
.tsx
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote\index.tsx doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
C:\MY_DRIVE\Projects\MyProject\AngularUpgrade\node_modules\angular-summernote\index.js doesn't exist
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! library-app@0.0.0 build: `rimraf src/main/webapp/dist && webpack --mode development --bail --progress --profile`
npm ERR! Exit status 1
npm ERR!
webpack.config.js
module.exports = {
entry: "./src/main/webapp/app/app.main.ts",
output: {
path: __dirname + '/src/main/webapp/dist',
filename: "bundle.js"
},
resolve: {
extensions: [".webpack.js", ".web.js", ".ts", ".tsx", ".js"],
alias: {
codemirror: './path/to/fake/codemirror'
}
},
module: {
rules: [
{
test: /\.tsx$/,
use: [
{loader: 'ts-loader'},
]
}
]
}
};
我已经尝试过以下给出的解决方案:
- https://github.com/summernote/angular-summernote/issues/158
- https://github.com/summernote/summernote/issues/1171
但没有任何效果。
我该如何解决这个问题?
解决方案
推荐阅读
- python - 根据另一个数据框和一些约束在数据框中生成一个新列
- sql-server - 对字母数字 SQL Server 列进行排序
- javascript - How to ask user or force update Android System WebView and Google Play Services ? [Ionic 4]
- c++ - 纹理创建返回 NULL
- java - Jungrapht 的可观察网络 + 网络事件 + 网络事件监听器
- javascript - Invoke a javascript function after page loading is finished?
- python - How to save a ReportLab Canvas as PNG image?
- bash - 导致空字符串的参数扩展被区别对待
- xml - 即使 contains() 不匹配,xmllint 也会选择一个节点
- python - numpy中的Python变量赋值