小型、高速のフロントエンド開発ガイド--vueエラーの一部を開発

その他 2019-11-26 19:17:07 訪問数: null

事前の開発プロセス

  1. レンダリングでエラーが発生しました：[Vueが警告] ：「例外TypeError：未定義のプロパティ『0』を読み込めません」。
    解決策：追加V-場合はDONE分析を

  2. キャッチされない例外TypeError：未定義の設定はできませんプロパティ「innerHTMLプロパティ」 

    DOM APIのこれらの報告されたエラーはすべて、から主に操作V-場合（NG-場合）、DOM表示なし;.何も最初のショーを表示する前に変更することができます

  3. ’<template>' cannot be keyed. Place the key on real elements instead.
    これは、VUE間違った言葉遣いを発生します。

          <template v-for="{item, index} in 5" :key="index">
            <the-list-item />
          </template>

それは以下のように与えられます：’<template>' cannot be keyed. Place the key on real elements instead.
平均：:keyテンプレートタグを変更するために使用することはできません。

          <template v-for="{item, index} in 5" >
            <the-list-item  :key="index"/>
          </template>

  1. ルート関連のエラー

  2. プロジェクトを開始した後コンソールのエラー Error occured while trying to proxy to: localhost:8002/admin/info
  • エラーを決定することは、ノード-SASSインストールしていない
    
負荷にキャッシュとハードをクリアする+ブラウザを閉じて、またはキャッシュのhttpをクリアするには、ブラウザを再起動します
  1. GET http://localhost:8000/__webpack_hmr 接続は、Aのようなリフレッシュを見て中断されました

パッケージ化されたコンパイルプロセス

  1. nodejsをアップグレードした後、VUE +ソリューションのWebPACKプロジェクトノード-SASSが与えられて
    解決するために：NPMノードi-SASS -D

  2. ビルドパッケージのコンパイルエラーVue build faild

エラー参考記事

  • 次のようにプロジェクトのコンパイルエラーと解決プロセスは、次のとおりです。
➜  jbcmVideo git:(oahcoay) ✗ npm run build

> [email protected] build /Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo
> node build/build.js

⠋ building for production.../Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/last-call-webpack-plugin/src/index.js:170
    compiler.hooks.compilation.tap(
                   ^

TypeError: Cannot read property 'compilation' of undefined
    at OptimizeCssAssetsWebpackPlugin.apply (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/last-call-webpack-plugin/src/index.js:170:20)
    at Compiler.apply (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/tapable/lib/Tapable.js:375:16)
    at webpack (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/webpack/lib/webpack.js:33:19)
    at err (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/build/build.js:19:3)
    at next (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/rimraf/rimraf.js:75:7)
    at CB (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/rimraf/rimraf.js:111:9)
    at /Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/rimraf/rimraf.js:137:14
    at FSReqWrap.oncomplete (fs.js:182:21)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `node build/build.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/macbookpro/.npm/_logs/2019-05-12T06_48_19_784Z-debug.log


➜  jbcmVideo git:(oahcoay) ✗ npm i [email protected] --save
npm WARN [email protected] requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.

+ [email protected]
added 5 packages and updated 3 packages in 12.301s
➜  jbcmVideo git:(oahcoay) ✗ npm run build

> [email protected] build /Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo
> node build/build.js

⠋ building for production.../Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/last-call-webpack-plugin/src/index.js:170
    compiler.hooks.compilation.tap(
                   ^

TypeError: Cannot read property 'compilation' of undefined
    at OptimizeCssAssetsWebpackPlugin.apply (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/last-call-webpack-plugin/src/index.js:170:20)
    at Compiler.apply (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/tapable/lib/Tapable.js:375:16)
    at webpack (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/webpack/lib/webpack.js:33:19)
    at err (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/build/build.js:19:3)
    at next (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/rimraf/rimraf.js:75:7)
    at CB (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/rimraf/rimraf.js:111:9)
    at /Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/rimraf/rimraf.js:137:14
    at FSReqWrap.oncomplete (fs.js:182:21)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `node build/build.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/macbookpro/.npm/_logs/2019-05-12T06_50_56_664Z-debug.log
➜  jbcmVideo git:(oahcoay) ✗ npm install --save-dev last-call-webpack-plugin
npm WARN [email protected] requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.

+ [email protected]
updated 1 package in 18.718s
➜  jbcmVideo git:(oahcoay) ✗ npm run build

> [email protected] build /Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo
> node build/build.js

⠋ building for production.../Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/last-call-webpack-plugin/src/index.js:170
    compiler.hooks.compilation.tap(
                   ^

TypeError: Cannot read property 'compilation' of undefined
    at OptimizeCssAssetsWebpackPlugin.apply (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/last-call-webpack-plugin/src/index.js:170:20)
    at Compiler.apply (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/tapable/lib/Tapable.js:375:16)
    at webpack (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/webpack/lib/webpack.js:33:19)
    at err (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/build/build.js:19:3)
    at next (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/rimraf/rimraf.js:75:7)
    at CB (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/rimraf/rimraf.js:111:9)
    at /Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/rimraf/rimraf.js:137:14
    at FSReqWrap.oncomplete (fs.js:182:21)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `node build/build.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/macbookpro/.npm/_logs/2019-05-12T06_53_52_260Z-debug.log
➜  jbcmVideo git:(oahcoay) ✗ npm i optimize-css-assets-webpack-plugin@2 --save 
npm WARN [email protected] requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of cssnano@>=3.4.0 but none is installed. You must install peer dependencies yourself.

+ [email protected]
added 3 packages, removed 162 packages, updated 1 package and moved 1 package in 13.777s
➜  jbcmVideo git:(oahcoay) ✗ npm run build
> [email protected] build /Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo
> node build/build.js

internal/modules/cjs/loader.js:596
    throw err;
    ^

Error: Cannot find module 'cssnano'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:594:15)
    at Function.Module._load (internal/modules/cjs/loader.js:520:25)
    at Module.require (internal/modules/cjs/loader.js:650:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at new OptimizeCssAssetsPlugin (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/node_modules/optimize-css-assets-webpack-plugin/index.js:12:33)
    at Object.<anonymous> (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/build/webpack.prod.conf.js:55:5)
    at Module._compile (internal/modules/cjs/loader.js:702:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
    at Module.load (internal/modules/cjs/loader.js:612:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:551:12)
    at Function.Module._load (internal/modules/cjs/loader.js:543:3)
    at Module.require (internal/modules/cjs/loader.js:650:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo/build/build.js:12:23)
    at Module._compile (internal/modules/cjs/loader.js:702:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `node build/build.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/macbookpro/.npm/_logs/2019-05-12T06_54_59_772Z-debug.log
➜  jbcmVideo git:(oahcoay) ✗ npm i cssnano --save-dev
npm WARN [email protected] requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.

+ [email protected]
added 163 packages in 17.227s
➜  jbcmVideo git:(oahcoay) ✗ npm run build

> [email protected] build /Users/macbookpro/Downloads/workspace/jbcm/jbcmVideo
> node build/build.js

⠹ building for production...
Starting to optimize CSS...
Processing static/css/app.68b3855e3d311999d47299118cadee89.css...
⠸ building for production...Processed static/css/app.68b3855e3d311999d47299118cadee89.css, before: 464096, after: 430542, ratio: 92.77%
Hash: e2174f907aebed0c2609
Version: webpack 3.12.0
Time: 44457ms
                                                  Asset       Size  Chunks                    Chunk Names
                        static/img/jbcmlogo.49e7f84.png    10.5 kB          [emitted]         
                           static/img/BRAND.5081ccf.png    17.6 kB          [emitted]         
                 static/fonts/element-icons.732389d.ttf      56 kB          [emitted]         
                        static/img/banner01.07a23d1.png    1.78 MB          [emitted]  [big]  
                       static/img/jbdxlogo2.970286b.png    13.5 kB          [emitted]         
                       static/img/[email protected]     327 kB          [emitted]  [big]  
                   static/img/icon_xiangxia.8364a0d.png    17.9 kB          [emitted]         
                          static/img/公众号二维码.4fee8ce.png    25.7 kB          [emitted]         
                   static/img/class_picture.7cf7ac2.png     276 kB          [emitted]  [big]  
                     static/img/course-desc.190c153.png     847 kB          [emitted]  [big]  
                static/fonts/element-icons.535877f.woff    28.2 kB          [emitted]         
                        static/img/jbdxlogo.0535093.png    15.7 kB          [emitted]         
               static/js/vendor.9944116eb145567d2a7b.js    1.36 MB       0  [emitted]  [big]  vendor
                  static/js/app.49cd273013387c8d38fa.js     178 kB       1  [emitted]         app
             static/js/manifest.2ae2e69a05c33dfc65f8.js  857 bytes       2  [emitted]         manifest
    static/css/app.68b3855e3d311999d47299118cadee89.css     431 kB       1  [emitted]  [big]  app
           static/js/vendor.9944116eb145567d2a7b.js.map    5.44 MB       0  [emitted]         vendor
              static/js/app.49cd273013387c8d38fa.js.map     557 kB       1  [emitted]         app
static/css/app.68b3855e3d311999d47299118cadee89.css.map     667 kB       1  [emitted]         app
         static/js/manifest.2ae2e69a05c33dfc65f8.js.map    4.97 kB       2  [emitted]         manifest
                                             index.html  927 bytes          [emitted]         

  Build complete.

  Tip: built files are meant to be served over an HTTP server.
  Opening index.html over file:// won't work.
  
—— build success;

おすすめ

転載: www.cnblogs.com/yc8930143/p/11937595.html
おすすめ
GitHub のホットリストに急上昇 — オープンソースのプログラミング言語とフレームワークは、どうしてこんなにも魅力的なのでしょうか?
北京ヒューマノイドロボットイノベーションセンターが、擬人化走行用の純粋な電気駆動を備えた世界初のフルサイズヒューマノイドロボット「Tiangong」を発売
ランキング
アリクラウドサーバ_ubuntu ECSシステムディスク拡張システム_
ボタンをクリックしてクリップボードにコピーします
脅威ハンティングを使用してサイバー セキュリティを強化する
ライン画像やコンテナnginxのの建設
Python での try の使用について書く
リアルタイムのデータウェアハウスを構築する方法高速データ時代、MySQLのAnalyticDBはあなたを教えて
Docker でのネットワークおよびデータ管理 (Docker Swarm クラスターおよび Docker データ管理を含む)
Java ループの比較: 従来の for ループ、拡張された for ループ、および forEach ループ
浙江大学版「C言語プログラミング（第3版）」演習2-18
Gestion du temps RTOS - Utilisation de la fonction de crochet SysTick pour réaliser l'échantillonnage de synchronisation et les sous-sections de ce chapitre
アーカイブ
もっと
2024-04-27(29)
2024-04-26(22)
2024-04-25(31)
2024-04-24(30)
2024-04-23(31)
2024-04-22(5)
2024-04-21(0)
2024-04-20(6)
2024-04-19(5)
2024-04-18(0)

コードワールド

© 2018 codetd.com