没有 CLI 的 Webpack 和 Angular 4

Question

我在没有cli的情况下以角度实现webpack。

目录树：

• 应用
• -应用程序
• --指令
• --服务
• --型号
• --更多... -资产 -build - webpack 配置
• -src

webpack 配置

• build.js >https://pastebin.com/6YCMvtF6
• config.js >https://pastebin.com/cQWMqjB0
• env_prod.js > https://pastebin.com/Gw9pv4EW
• webpack_base_config.js >https://pastebin.com/gSGrayed
• webpack_prod_config.js >https://pastebin.com/3m26ZVaa

命令 NPM RUN PROD 抛出

    ERROR in   Error: Child compilation failed:
  Entry module not found: Error: Can't resolve 'E:\index.html' in 'E:\cms  s':
  Error: Can't resolve 'E:\index.html' in 'E:\cms'

  - compiler.js:76
    [cms_authors]/[html-webpack-plugin]/lib/compiler.js:76:16

  - Compiler.js:296 Compiler.<anonymous>
    [cms_authors]/[webpack]/lib/Compiler.js:296:10

  - Compiler.js:499
    [cms_authors]/[webpack]/lib/Compiler.js:499:13

  - Tapable.js:202 next
    [cms_authors]/[tapable]/lib/Tapable.js:202:11

  - CachePlugin.js:62 Compiler.<anonymous>
    [cms_authors]/[webpack]/lib/CachePlugin.js:62:5

  - Tapable.js:206 Compiler.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:206:13

  - Compiler.js:496
    [cms_authors]/[webpack]/lib/Compiler.js:496:10

  - Tapable.js:195 Compilation.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:195:46

  - Compilation.js:649 self.applyPluginsAsync.err
    [cms_authors]/[webpack]/lib/Compilation.js:649:19

  - Tapable.js:195 Compilation.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:195:46

  - Compilation.js:640 self.applyPluginsAsync.err
    [cms_authors]/[webpack]/lib/Compilation.js:640:11

  - Tapable.js:202 next
    [cms_authors]/[tapable]/lib/Tapable.js:202:11

  - UglifyJsPlugin.js:230 Compilation.compilation.plugin
    [cms_authors]/[webpack]/lib/optimize/UglifyJsPlugin.js:230:5

  - Tapable.js:206 Compilation.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:206:13

  - Compilation.js:635 self.applyPluginsAsync.err
    [cms_authors]/[webpack]/lib/Compilation.js:635:10

  - Tapable.js:195 Compilation.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:195:46

ERROR in Entry module not found: Error: Can't resolve 'E:\cms_authors\app\systemjs.config.js' in 'E:\cms'

ERROR in ./app/_services/hash.service.ts
Module not found: Error: Can't resolve 'sha256' in 'E:\cms_authors\app\_services'
 @ ./app/_services/hash.service.ts 10:0-17
 @ ./app/_services/index.ts
 @ ./app/app.module.ts
 @ ./app/main.ts

ERROR in ./app/_directives/article/preview.component.html?v=${new Date().getTime()}
Module not found: Error: Can't resolve './assets/images/phone_image.png' in 'E:\cms\app\_directives\article'
 @ ./app/_directives/article/preview.component.html?v=${new Date().getTime()} 1:2388-2430
 @ ./app/_directives/article/preview.component.ts
 @ ./app/_directives/article/index.ts
 @ ./app/app.module.ts
 @ ./app/main.ts

Answer 1

显然 html webpack 插件无法访问 index.html。不清楚index.html 在您的文件夹结构中的位置。建议将HtmlWebpackPlugin.template 值编辑到index.html 的适当位置。如果有帮助，您可以在此处参考带有 webpack 的 angular（即没有 ng-cli）：https://github.com/rakcheru/webpack-angular5

Answer 2

几乎:)

- building for production...
[at-loader] Checking started in a separate process...

[at-loader] Ok, 1.317 sec.
Hash: 3be42f85ac92a975a792
Version: webpack 2.5.1
Time: 31485ms
       Asset     Size  Chunks  Chunk Names
  index.html  5.74 kB
   vendor.js  2.23 MB       0  vendor
   client.js   349 kB       1  client
   styles.js  1.37 kB       2  styles
client.js.gz  86.7 kB
vendor.js.gz   444 kB

WARNING in ./~/angular2-datatable/~/@angular/core/src/linker/system_js_ng_module_factory_loader.js
71:15-36 Critical dependency: the request of a dependency is an expression

WARNING in ./~/angular2-datatable/~/@angular/core/src/linker/system_js_ng_module_factory_loader.js
87:15-102 Critical dependency: the request of a dependency is an expression

ERROR in   Error: Child compilation failed:
  Module parse failed: M:\cms\assets\images\_logo_files\logo_small.png Unexpected character '�' (1:0)
  You may need an appropriate loader to handle this file type.
  (Source code omitted for this binary file):
  SyntaxError: Unexpected character '�' (1:0)

  - compiler.js:76
    [cms_authors]/[html-webpack-plugin]/lib/compiler.js:76:16

  - Compiler.js:296 Compiler.<anonymous>
    [cms_authors]/[webpack]/lib/Compiler.js:296:10

  - Compiler.js:499
    [cms_authors]/[webpack]/lib/Compiler.js:499:13

  - Tapable.js:202 next
    [cms_authors]/[tapable]/lib/Tapable.js:202:11

  - CachePlugin.js:62 Compiler.<anonymous>
    [cms_authors]/[webpack]/lib/CachePlugin.js:62:5

  - Tapable.js:206 Compiler.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:206:13

  - Compiler.js:496
    [cms_authors]/[webpack]/lib/Compiler.js:496:10

  - Tapable.js:195 Compilation.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:195:46

  - Compilation.js:649 self.applyPluginsAsync.err
    [cms_authors]/[webpack]/lib/Compilation.js:649:19

  - Tapable.js:195 Compilation.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:195:46

  - Compilation.js:640 self.applyPluginsAsync.err
    [cms_authors]/[webpack]/lib/Compilation.js:640:11

  - Tapable.js:202 next
    [cms_authors]/[tapable]/lib/Tapable.js:202:11

  - UglifyJsPlugin.js:230 Compilation.compilation.plugin
    [cms_authors]/[webpack]/lib/optimize/UglifyJsPlugin.js:230:5

  - Tapable.js:206 Compilation.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:206:13

  - Compilation.js:635 self.applyPluginsAsync.err
    [cms_authors]/[webpack]/lib/Compilation.js:635:10

  - Tapable.js:195 Compilation.applyPluginsAsyncSeries
    [cms_authors]/[tapable]/lib/Tapable.js:195:46



ERROR in ./app/_services/hash.service.ts
Module not found: Error: Can't resolve 'sha256' in 'M:\cms\app\_services'
 @ ./app/_services/hash.service.ts 10:0-17
 @ ./app/_services/index.ts
 @ ./app/app.module.js