עזרה בייבוא ספריה לתוך פרוייקט בnodejs

dovid

אני לא מבין כלום. מה הכונה ניסיתי בצד לקוח? מה הקשר scss שזה שפת pre-css לJS? מה הכונה העתקתי לשרת, למקום נגיש ללקוח?
בקשר לNPM, כל עוד לא התקנת אותו זה לא יופיע ואין טעם להתקין אותו אם השימוש הוא בצד לקוח.

chagold

@dovid הבנתי מהפוסט שלך שיש 2 אפשרויות להשתמש בספריה בפרוייקט, או להתקין עם הפקודה npm install iview --save ואח"כ לטעון עם 'import from 'iview. או (כאשר הנושא הוא סקריפט עבור שימוש בצד לקוח) לקרוא ישירות לספריה.
וכיון שכאן זה מיועד עבור צד לקוח, אז טענתי את הספריה באפשרות השניה שנתת.

scss - מה לעשות שככה קיבלתי את הפרוייקט...

דף האינטרנט כתוב במבנה היררכיוני כזה בערך..

 doctype html
 
 head
 
     title Dashboard
 
 
 
 body(class=login)
 
     .login
 
         .login_container
 
             .login_logo Dashboard
 
             .login-item
 
                 form#login_form.form.form-login(@submit.prevent="login")
 
                     .form-field

ובסופו ככה (כולל ההוספה שלי):

         footer.admin__footer
 
         
 
     script(src="iview.min.js")
 
     script(src="admin.js")
 
     link(rel="stylesheet", href="admin.css")

בהתחלה התקנתי את הספריה באמצעות הפקודה npm install iview --save הנ"ל אבל כשזה לא טען אז הוספתי את ספריית ה-JS הנ"ל לבין הקבצים שבשרת וקישרתי באמצעות התגית

      script(src="iview.min.js")

כמו שבJSFIDDLE זה מקושר אליו. וכאמור זה לא עובד.
תודה.

dovid

טוב.
הקובץ שקראת לו scss זה לכאורה Jade שזה Template Engine כלומר תבנית שמרונדרת ע"י צד השרת (במקרה זה כנראה expressjs) לHTML רגיל.
התגית

 script(src="admin.js")

מרונדרת לתגית סקריפט רגילה, וזה אמור לעבוד לך, בתנאי שהקובץ בכתובת זהה לקובץ admin.js כלומר בשורש האתר הנגיש ללקוח.

dovid

שים לב אתה לא חייב להיות בספק אם הסקריפט נטען או לא - הקונסול חייב לספק לך שגיאה, וגם תוכל להציץ במקור ולראות את תגית הסקריפט בתפארתה.

chagold

נכון.
יש שגיאה

 GET http://localhost:3000/iview.min.js net::ERR_ABORTED 404 (Not Found)

אבל לadmin.js שממוקם באותו תיקיה אין שגיאה

dovid

אם http://localhost:3000/iview.min.js מחזיר שגיאה, ו http://localhost:3000/admin.js לא, אז אחרי שוידאת פעם נוספת שהקובץ נקרא בדיוק iview.min.js אז צריך לבדוק מה קורה עם הניתוב של express והאם יש בפרוייקט תיקיה סטטית.
בקיצור תצטרך לעבור על הקוד ולראות האם יש app.static. וא"כ לאיזה תיקיה זה מוביל. ייתכן שיש נטו לקובץ admin.js ניתוב אינדבדואלי, אם כי זה די משונה.

zvizvi

@dovid אמר בעזרה בייבוא ספריה לתוך פרוייקט בnodejs:

כאורה Jade שזה Template Engine כלומר תבנ

2 הערות:

בגרסאות האחרונות של NPM כבר לא צריך להוסיף את המילה --save כי זה נשמר בפרוייקט גם בלי זה.
Node עד גירסה 10 (ואולי אף מעבר - לא בדקתי) לא תומך בImport. יש להשתמש בכתיב הבא:

const iview = require('iview');

chagold

עשיתי, וזה עדיין לא עובד.
יצויין שה-vscode שלי טוען ש

 [ts] 'iview' is declared but its value is never read.

והוא באמת לא מופיע במסמך כי התגית היחידה היא i-circle .
יתכן שחסר עוד משהו חוץ מהייבוא הנ"ל?

dovid

@chagold אמר בעזרה בייבוא ספריה לתוך פרוייקט בnodejs:

עשיתי, וזה עדיין לא עובד.

מה עשית? @zvizvi דיבר אלי, עבורך זה לא רלוונטי. שוב, צד לקוח מתחיל ונגמר בhtml.

chagold

ובצד לקוח אמורה/עלולה להיות בעיה אם שמתי נתיב גלובלי ככה:

     script(src="https://cdn.bootcss.com/iview/2.0.0-rc.9/iview.min.js")

כי יש שגיאה זו:

0_1541021942034_f9680262-07b9-445a-be1f-7d848f2e3f8c-image.png

בHTML הוא מופיע נכון

 <script src="https://cdn.bootcss.com/iview/2.0.0-rc.9/iview.min.js"></script>

dovid

הצורה הזו תקינה לגמרי, וגם השגיאה הזו מראה שהסקריפט נטען אלא שיש בו שגיאה.
אולי בגלל תלות חסרה ואולי להיפך - התנגשות עם משתנה גלבלי של ספריה אחרת.
בכל אופן את הדילמה איך לשים את הסקריפט פתרת עם הלינק החיצוני לCDN.
אולי תבחר גירסה שונה? למשל האחרונה:
https://cdn.bootcss.com/iview/3.1.4/iview.min.js

chagold

@dovid אין שינוי

chagold

@dovid אמר בעזרה בייבוא ספריה לתוך פרוייקט בnodejs:

אולי להיפך - התנגשות עם משתנה גלבלי של ספריה אחרת.

אולי כי התקנתי את הספריה הזו בשרת.
איך מסירים אותה?

dovid

@chagold אמר בעזרה בייבוא ספריה לתוך פרוייקט בnodejs:

@dovid אמר בעזרה בייבוא ספריה לתוך פרוייקט בnodejs:

אולי להיפך - התנגשות עם משתנה גלבלי של ספריה אחרת.

אולי כי התקנתי את הספריה הזו בשרת.
איך מסירים אותה?

אין שום קשר בין הצד שרת לצד לקוח - בצד הלקוח, כל דף, הוא עולם עצמאי עומד לחלוטין בפני עצמו וכלום לא משפיע עליו חוץ מתוכנו - HTML, וממנו נגזרים הJS והCSS שמפורשים בו.
אין לי תשובה למה יש לך את השגיאה.

chagold

עריכה:
https://docs.npmjs.com/getting-started/uninstalling-local-packages

chagold

@chagold אמר בעזרה בייבוא ספריה לתוך פרוייקט בnodejs:

ובצד לקוח אמורה/עלולה להיות בעיה אם שמתי נתיב גלובלי ככה:
     script(src="https://cdn.bootcss.com/iview/2.0.0-rc.9/iview.min.js")
כי יש שגיאה זו:

בHTML הוא מופיע נכון
 <script src="https://cdn.bootcss.com/iview/2.0.0-rc.9/iview.min.js"></script>

זה איזשהו בעיה של קידוד. בדפדפן שלי יש חלקי מהקוד שמוצגים בסינית עתיקה:

0_1541107403212_406b590c-0d06-4f3e-b9f2-3e28e11a0bc9-image.png

וכשניסיתי, לדוגמא להעלות את דומת הקוד השגוי לכאן (להתכתבות בפורום) אז כל השגיאות נהפכו לטקסט סטנדרטי.
אם למישהו יש מושג מה עלול לגרום את בעיית הקידוד הזו?
תודה.

dovid

@chagold אמר בעזרה בייבוא ספריה לתוך פרוייקט בnodejs:

https://cdn.bootcss.com/iview/2.0.0-rc.9/iview.min.js

בקשר לסינית זו לא בעיה, זה באמת ככה בקובץ המקור (זה בשביל שיהיה כיתוב מתאים בכמה שפות).

chagold

נראה לי שזה תואם לבעיה שלי.
שאלה: איך אני ממיר את מה שכתוב שם לscss?

 <script type="text/javascript">
 
   window.iview= iview;
 
   window.iview[ "default" ] = iview;
 
 </script>

dovid

לא יודע מי תקע לך בראש את scss, זה בכלל בכלל לא זה.
זה jade כמו שכתבתי לך למעלה, וכותבים שמה ככה:

:javascript
  | window.iview= iview;
  | window.iview[ "default" ] = iview;

chagold

@dovid אכן טעיתי בהקשר של scss אבל לענ"ד זה תבנית אחרת ולא jade , כי בשורות אחרות בפרוייקט התגית סקריפט מוצגת ככה:

 script(src="https://cdn.bootcss.com/iview/2.0.0-rc.9/iview.min.js")

וזה התבטאות שלא מופיעה בjade בכ"א לפי מה שהספקתי לראות.

כמו"כ ניסיתי את מה שכתבת לי, וזה עשה שגיאה (דהיינו 'אחרי קימפול').

 C:\xampp\htdocs\views\admin.pug:57 unknown filter ":javascript"
 
 Error: C:\xampp\htdocs\views\admin.pug:57
 
 
 
 unknown filter ":javascript"
 
     at makeError (C:\xampp\htdocs\node_modules\pug-error\index.js:32:13)
 
     at filterWithFallback (C:\xampp\htdocs\node_modules\pug-filters\lib\handle-filters.js:47:17)
 
     at walk.includeDependencies (C:\xampp\htdocs\node_modules\pug-filters\lib\handle-filters.js:20:18)
 
     at walkAST (C:\xampp\htdocs\node_modules\pug-walk\index.js:23:18)
 
     at C:\xampp\htdocs\node_modules\pug-walk\index.js:104:20
 
     at Array.reduce (<anonymous>)
 
     at walkAndMergeNodes (C:\xampp\htdocs\node_modules\pug-walk\index.js:103:18)
 
     at walkAST (C:\xampp\htdocs\node_modules\pug-walk\index.js:37:19)
 
     at walkAST (C:\xampp\htdocs\node_modules\pug-walk\index.js:48:21)
 
     at C:\xampp\htdocs\node_modules\pug-walk\index.js:104:20

תחומים - פורום חרדי מקצועי

עזרה בייבוא ספריה לתוך פרוייקט בnodejs