programing

라라벨의 예.vue가 업데이트되지 않음

coolbiz 2022. 7. 2. 14:15
반응형

라라벨의 예.vue가 업데이트되지 않음

라라벨 5 프로젝트에서 Vue를 사용하는 방법을 찾고 있습니다.기본 Laravel 설치는 app.js 및 Example.vue와 함께 제공됩니다.home.blade.php에 추가하여 뷰에 "I am a example component!"라고 표시할 수 있었습니다.저를 혼란스럽게 하는 것은 무엇보다도 이 컴포넌트를 전혀 변경할 수 없다는 것입니다.

Example.vue에서 텍스트를 변경해도(논리가 아닌 템플릿 부분만) 전혀 업데이트되지 않습니다.(Laravel docs 등에 따라 npm run dev를 실행하려고 하면 오류 없이 컴파일 되는 것 같고 /public/js/app.js는 변경되지만 브라우저 표시는 변경되지 않습니다.)

app.blade를 수정할 때.php 이러한 변경은 home.blade.dlash의 변경사항과 같이 표시됩니다.그러나 /resources/assets/js/app.js 또는 Example의 내용을 변경했다는 증거를 찾을 수 없습니다.vue는 영향을 미칩니다.app.blade에서 id="app"을 제거하면 더 혼란스럽습니다.php div 요소. 이렇게 해도 Example 컴포넌트는 사라지지 않습니다.vue jsfiddle을 사용한 조작을 보면 컴포넌트가 파손될 것으로 생각됩니다.

캐싱 문제인지 컴파일 문제인지, vue 작동 방식인지 잘 모르겠지만 뭐가 잘못되었는지 알 수 없습니다.저는 webpack.mix.js 파일을 larvel 설치에서 바로 사용하고 있으며 vagrant를 중지하고 재시작하여 브라우저를 새로고침하고 php artisian cache:clear를 시도했습니다.(이전에는 Mix가 아닌 Elixir를 사용하여 vueify와 guffe, 같은 문제를 발생시켰습니다.)

어떤 제안이라도 해주시면 감사하겠습니다!

브라우저(F12)에서 콘솔을 열고 네트워크에 접속하여 비활성화 캐시를 체크 및 끄고 페이지를 새로고침하려고 했습니까?브라우저가 여기에 이미지 설명 입력이전 스토리지 파일을 사용하는 경우.

이 방법은 효과가 있었습니다.

특정 환경에서는 파일이 변경될 때 웹 팩이 업데이트되지 않을 수 있습니다.시스템에 이 문제가 있는 경우 watch-poll 명령어의 사용을 검토해 주십시오.

npm run watch-poll

자세한 것은 이쪽

나도 똑같은 문제가 있었어.로컬 개발 환경(Mac OS X Sierra, php7, mysql)을 사용하고 있습니다.위와 같이 캐시 클리닝을 시도했습니다.php 서버를 정지 및 재기동했습니다(만일을 위해).( ): 운이 없다.그 후 '컴포저 덤프 자동 로드' 문제가 발생.그리고 'npm run watch'는 다음과 같은 메시지를 전달했습니다.

> @ watch /Users/ulam/code/myproj
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

 10% building modules 1/1 modules 0 active Webpack is watching the files…

 95% emitting

 DONE  Compiled successfully in 4171ms

그 후:

nks                    Chunk Names
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.eot?f4769f9bdb7466be65088239c12046d1  20.1 kB          [emitted]
fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb    18 kB          [emitted]
 fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff?fa2772327f55d8198301fdb8bcfc8158  23.4 kB          [emitted]
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.ttf?e18bbf611f2a2e43afc071aa2f4e1512  45.4 kB          [emitted]
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.svg?89889688147bd7575d6327160d64e760   109 kB          [emitted]
                                                                                               /js/app.js   1.2 MB       0  [emitted]  [big]  /js/app
                                                                                             /css/app.css   147 kB       0  [emitted]         /js/app


 WAIT  Compiling...                                                                                            19:48:26

 95% emitting

 DONE  Compiled successfully in 86ms                                                                           19:48:26

       Asset    Size  Chunks                    Chunk Names
  /js/app.js  1.2 MB       0  [emitted]  [big]  /js/app
/css/app.css  147 kB       0  [emitted]         /js/app


 WAIT  Compiling...                                                                                            19:49:37

 95% emitting

 DONE  Compiled successfully in 121ms                                                                          19:49:38

       Asset    Size  Chunks                    Chunk Names
  /js/app.js  1.2 MB       0  [emitted]  [big]  /js/app
/css/app.css  147 kB       0  [emitted]         /js/app

그 후 모든 것이 성공했습니다.(라벨 5.5.3)

저도 똑같은 문제가 있어요.캐시를 비활성화하고 캐시 및 보기를 삭제해도 도움이 되지 않습니다.저는 Larabel 5.4를 사용하여 공유 호스팅 사이트를 개발하고 있습니다.

이 비디오 https://www.youtube.com/watch?v=pTVCW5k4piU 의 코멘트에서는, npm 인스톨과 npm 의 watch 를 실행할 것을 제안하고 있습니다.https://ferugi.com/blog/nodejs-on-godaddy-shared-cpanel/ 페이지의 지시에 따라 npm 설치를 실행할 수 있었지만 npm run watch에서 오류가 발생했습니다.

Vue 컴포넌트는 제가 원하는 최고의 솔루션이 될 것 같습니다만, 이 컴포넌트를 사용할 수 없다면 AJAX를 사용해야 합니다.

Vue.로 Vue.js 프로젝트를 합니다.npm run serve watchchernpm을 에 실행합니다.Vue.js 프로s 。는 음음음음음음음을 통해서 서비스를 하고 있기 php artisian serve, 「동행」도 실행할 가 있습니다.npm run watchphp artisan serve라라벨의 변화만 지켜봐

방법이 실행 입니다.php artisan serve ★★★★★★★★★★★★★★★★★」npm run watch개발 프로젝트를 변경할 때 함께 사용할 수 있습니다.

★★★★★★npm install npm-watch

저도 같은 문제가 있었습니다.XAMP를 사용하고 있었는데, 대신 'php 장인 서브'를 사용해 보았습니다.

라라벨과 vuejs를 다룰 때도 비슷한 문제에 직면했습니다.

스텝 1. 확인npm run watch ★★★★★★★★★★★★★★★★★」npm run watch-poll이치노

스텝 2. app.js 파일이 크면 브라우저가 캐싱할 가능성이 높습니다.Ctrl+F5 및 Ctrl+Shift+F5(Chrome 켜기)를 사용하여 브라우저 캐시를 지웁니다.

스텝 3. 이 방법은 캐시 버스트에 적합합니다.더하다.version()webpack.config.js.

ㅇㅇ.mix.js('resources/js/app.js','public/js').vue().sass('resources/sass/app.scss', 'public/css').version();

<script src="{{ mix('js/app.js') }}" defer type="text/javascript"></script>.

이것에 의해, 모든 캐시의 문제가 해소됩니다. : )

언급URL : https://stackoverflow.com/questions/42241106/laravel-example-vue-not-updating

반응형