স্টাইলশিটটি মাইম টাইপের কারণে লোড হয়নি


381

আমি এমন একটি ওয়েবসাইটে কাজ করছি gulpযা ব্রাউজারকে আমার পরিবর্তনগুলির সাথে সিঙ্ক্রোনাইজ রাখতে সংকলন এবং ব্রাউজার সিঙ্ক করতে ব্যবহার করে।

গাল্প টাস্ক সবকিছু ঠিকঠাকভাবে কম্পাইল করে তবে ওয়েবসাইটে, আমি কোনও স্টাইল দেখতে পারিনি, এবং কনসোলটি এই ত্রুটি বার্তাটি দেখায়:

' Http: // লোকালহস্ট: 3000 / সম্পদ / শৈলী / কাস্টম-স্টাইল। CSS ' থেকে স্টাইল প্রয়োগ করতে প্রত্যাখ্যান করা হয়েছে কারণ এর মাইম টাইপ ('পাঠ্য / এইচটিএমএল') কোনও সমর্থিত স্টাইলশিট এমআইএমআই টাইপ নয়, এবং কঠোর এমআইএম চেকিং সক্ষম রয়েছে।

এখন, আমি কেন সত্যিই বুঝতে পারি না।

এইচটিএমএলে এই ফাইলটি অন্তর্ভুক্ত রয়েছে (যা আমি নিশ্চিত যে সঠিক)

<link rel="stylesheet" type="text/css" href="assets/styles/custom-style.css"/>

স্টাইলশিট হ'ল বুটস্ট্র্যাপ এবং হরফ হ'ল ফন্ট-দুর্দান্ত স্টাইলগুলির মধ্যে একত্রীকরণ (এখনও কোনও কাস্টম নেই)।

পথটিও ঠিক সঠিক, কারণ এটি ফোল্ডারের কাঠামো:

index.html
assets
|-styles
  |-custom-style.css

তবে আমি ত্রুটি পেতে থাকি।

এটা কী হতে পারতো? এটি গুল্প / ব্রাউজারসিংকের জন্য সম্ভবত কিছু (সম্ভবত কোনও সেটিং?)?


আমার লিঙ্ক করা স্টাইলশিটটি কেবল শৈলীর নিয়মগুলিতে সরাসরি লাফানোর পরিবর্তে এইচটিএমএল <স্টাইল ... ট্যাগ দিয়ে শুরু করলে আমি এটি পাচ্ছিলাম। পরে লোড হওয়া এইচটিএমএল ফাইলে (অ্যাঙ্গুলারজেএস) লিঙ্ক করার সময় আমি এটিও পেয়েছিলাম তাই আমি জাভাস্ক্রিপ্টের মাধ্যমে পৃষ্ঠা লোডে ডায়নামিকভাবে লোড করতে চলেছি এবং সমস্যাটি চলে গেল।
নিউক্লিক

82
আপনি যখন ফাইলটিতে একটি ভুল URL সেট করেন বা যখন আপনার সার্ভারটি সঠিকভাবে কনফিগার করা হয় না তখন এটি ঘটে। ফলস্বরূপ, ব্রাউজারটি স্টাইলশিটটি পায় না, তবে এটি 404 স্থিতি এবং "সামগ্রী-প্রকার" শিরোনাম সহ কিছু HTML পায়। যেহেতু ব্রাউজারটি সার্ভার থেকে কিছু পেয়েছে, এটি আপনাকে কোনও উত্তর বলে না, তবে এটি আপনাকে জানায় যে ফাইলের মাইম টাইপটি ভুল is এটি যাচাই করার দ্রুততম উপায় হ'ল সরাসরি http://localhost:3000/assets/styles/custom-style.cssকোনও নতুন ট্যাবে ফাইলটি খোলার চেষ্টা করা ।
RussCoder

6
আমার ক্ষেত্রে এটি ছিল রাশকোডার বর্ণিত কেস। এর পিছনে কারণ হ'ল আমি কৌণিক ব্যবহার করেছি এবং কৌনিক.জসনে স্টাইলের প্যাকেজিংয়ে একটি সিএসএস ফাইল যুক্ত করতে ভুলে গেছি। সুতরাং অ্যাপটি তৈরি করার সময় এটি উপেক্ষা করা হয়েছিল।
জানা

1
আমি বসন্ত সুরক্ষা কনফিগারেশন দ্বারা এই সমস্যাটি সমাধান করতে সক্ষম হতে পারে। এটি রিসোর্স ফোল্ডারে অ্যাক্সেসকে আটকাচ্ছে।
sndu

2
একটি খারাপ proxy.conf.jsonসেটআপ আমাদের এই অদ্ভুত ত্রুটির দিকে পরিচালিত করেছে, যেহেতু ব্যাকএন্ড এপিআইতে ফরোয়ার্ড করার অনুরোধটি সঠিকভাবে কাজ করছে না, সুতরাং এইচটিএমএল ত্রুটির প্রতিক্রিয়া।
ktsangop

উত্তর:


137

নোড.জেএস অ্যাপ্লিকেশনগুলির জন্য, আপনার কনফিগারেশনটি পরীক্ষা করুন:

app.use(express.static(__dirname + '/public'));

লক্ষ্য করুন যে /publicশেষে একটি ফরোয়ার্ড স্ল্যাশ নেই, তাই আপনাকে এটি আপনার HTML এর href বিকল্পে অন্তর্ভুক্ত করতে হবে:

href="/css/style.css">

যদি আপনি একটি ফরোয়ার্ড স্ল্যাশ অন্তর্ভুক্ত করেন ( /public/) তবে আপনি ঠিক করতে পারেন href="css/style.css"


href = "/ সম্পদ / শৈলী। CSS"> আমার ক্ষেত্রে সমস্যার সমাধান!
সার্জিও গেরজিক

127

আমার মনে হয়, বিষয়টি মন্তব্যগুলির সাথে শুরু করে একটি সিএসএস লাইব্রেরি সহ ছিল।

বিকাশে থাকাকালীন, আমি ফাইলগুলি মিনিফাই করি না এবং আমি মন্তব্যগুলিও সরিয়ে নেই। এর অর্থ হ'ল স্টাইলশিটটি কিছু মন্তব্য দিয়ে শুরু হয়েছিল, যার ফলে এটি সিএসএস থেকে আলাদা কিছু হিসাবে দেখা যায়।

লাইব্রেরিটি সরিয়ে ফেলা এবং এটি কোনও বিক্রেতার ফাইলে রেখে দেওয়া (যা সর্বদা মন্তব্য ছাড়াই নিখুঁত হয়) সমস্যার সমাধান করে।

আবার, আমি 100% নিশ্চিত নই যে এটি একটি স্থির, তবে এটি এখনও আমার জন্য একটি জয় যা এটি এখন প্রত্যাশা অনুযায়ী কাজ করে।


4
অর্ধেক স্থির কারণ আপনি যদি এই সমস্ত সিএসএস বিক্রেতার মধ্যে রাখতে না চান তবে আপনার কী করা উচিত? আপনি যখন নিজের অ্যাপ্লিকেশনটি পরীক্ষা করেন তখন নোড_মডিউলগুলি ন্যূনতম করুন? দোহ ... একটি নির্দিষ্ট মডিউলটি সংকলনের জন্য আপনি কি কিছু পেয়েছেন?
স্টিফফায়ার

1
আমার সংকলনের প্রক্রিয়াতে, বিক্রেতা ফাইলটি কেবল বিল্ডে তৈরি হয় এবং তারপরে আমি কেবল যে ফাইলগুলিতে প্রকৃতপক্ষে কাজ করছি সেগুলির পরিবর্তনগুলি লক্ষ্য করি (যা সাধারণত বিক্রেতার মধ্যে যায় এমন কিছুই নয়)। এর অর্থ হ'ল প্রথম বিল্ডটি কিছুটা ধীর গতিযুক্ত তবে তারপরে আমি কেবল আমার ফাইলগুলি সংশোধন ছাড়াই সংকলন করি যা আমার জন্য প্রক্রিয়াটি ধীর করে দিচ্ছে না
নিক

3
আমি এই একই সমস্যার মধ্যে দৌড়ে গিয়ে দেখলাম যে আমি সার্ভারে একটি নন-মিনিফাইড ফাইল হিসাবে উপস্থিত ফাইলের একটি সংক্ষিপ্ত সংস্করণ লোড করার চেষ্টা করছি। সুতরাং, যখন সার্ভারে ফাইলটি "কাস্টম-স্টাইল। CSS" ছিল তখন আমি "কাস্টম-স্টাইল.মিন.সি.এস.এস" লোড করার চেষ্টা করছিলাম। একবার আমি সঠিক সংস্থান লোড করার জন্য আমার লিঙ্কটি পরিবর্তন করেছি, সবকিছু ঠিকঠাক কাজ করেছে।
প্রোগ্রামার ড্যান

সমস্যাটি সিএসএসের মধ্যে সীমাবদ্ধ নয়। আমি একটি জেএস ফাইলে একটি 404 পেয়েছি যা প্রথম লাইনে একটি মন্তব্যের কারণে হয়েছিল।
কালো

80

আপনি যখন নিজের সিএসএস ফাইলকে সঠিকভাবে উল্লেখ না করছেন তখনও এই ত্রুটিটি আসতে পারে।

উদাহরণস্বরূপ, যদি আপনার লিঙ্ক ট্যাগ হয়

<link rel="stylesheet" href="styles.css">

তবে আপনার সিএসএস ফাইলটির নাম দেওয়া হয়েছে style.css(দ্বিতীয়টি ছাড়াই) তবে আপনি এই ত্রুটিটি দেখতে পাবে এমন একটি ভাল সুযোগ রয়েছে।


4
হুবহু আমার কি হয়েছে। আমি এখানে প্রতিটি উত্তর চেষ্টা করেছি (মাইমটাইপ পরিবর্তন করুন, সিএসএস মন্তব্যগুলি সরান, নোড.জেএস কনফিগারেশন পরিবর্তন করুন ...)। আমাকে যা করতে হয়েছিল তা হ'ল সিএসএস নামে একটি টাইপো ঠিক করা। ডোহ!
এজেপিরেজ 23'18

5
এই উত্তরে যুক্ত করার জন্য, নিশ্চিত হন যে জালটি আসলে CSS ফাইলটি খুঁজে পেয়েছে এবং এটি আপনার ডিপগুলিতে পাইপ করেছে। যখনই আমি এই ত্রুটিটি পেয়েছি, এটি কারণ যে আমি কোনওভাবে CSS ফাইলগুলিতে আমার পথটি আঁকিয়েছি এবং এটি বিল্ড ডিরেক্টরিতে উপস্থিত নেই।
এলএডামস ৮87

5
হ্যাঁ, আমার জন্য একই, একটি সাধারণ এবং বোকা টাইপো। আমি মনে করি এটি কী করে যে সার্ভারটি একটি 404 প্রতিক্রিয়া পৃষ্ঠা প্রেরণ করে, তাই আপনার ব্রাউজারটি সেই 404 পৃষ্ঠা পান এবং আপনাকে বলে যে এটি সঠিক সিএসএস নয় ... যা সত্য।
tanou

62

বেশিরভাগ ক্ষেত্রে, এটি কেবলমাত্র হতে পারে সিএসএস ফাইলের পথটি ভুল । সুতরাং ওয়েব সার্ভারটি status: 404কিছু ধরণের Not Foundসামগ্রী পেললোড দিয়ে ফিরে আসে html

ব্রাউজারটি <link rel="stylesheet" ...>সিএসএস শৈলী প্রয়োগের অভিপ্রায় অনুসারে ট্যাগ থেকে এই (ভুল) পথ অনুসরণ করে। তবে ফিরে আসা সামগ্রীর ধরণটি বিপরীত হয় যাতে এটি একটি ত্রুটি লগ করে।

এখানে চিত্র বিবরণ লিখুন


আমার সমস্যাটি ছিল যে পথটি অবৈধ। তবে, আমার কৌণিক প্রকল্পটি ভুল হওয়ার জন্য বেজ হ্রেফ সেটটির কারণে এই খারাপ পথটি হয়েছিল। আপনার বেস href আপডেট করার পরে অন্য কেউ যদি এই ত্রুটি দেখতে শুরু করে থাকে তবে এটি কারণ হতে পারে।
ক্রেজকো

1
সিএসএস ফাইলে একটি 404 ত্রুটি এটি (প্রাথমিকভাবে)
বিস্মৃত

1
সমস্যা সমাধানের আরেকটি উপায়, আপনি যে URL টি এই ত্রুটিটি পেয়ে যাচ্ছেন তা অন্য ট্যাবে আটকান, আপনি যদি সিএসএস না দেখেন তবে সম্ভবত এটিই সমস্যা
ব্ল্যাকিসাইস

আপনার ইঙ্গিতটির জন্য আপনাকে
জেসন ঝো

52

কৌণিক কাঠামো অনুযায়ী স্টাইল। CSS ফাইলের ঠিক নীচে / উপরে একটি ফোল্ডার তৈরি করুন এবং এর মতো একটি লিঙ্ক সরবরাহ করুন <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

এখানে চিত্র বিবরণ লিখুন


23
কেন এই কাজ করে? ত্রুটিটি বলে যে "পাঠ্য / এইচটিএমএল" কোনও সমর্থিত মাইম টাইম নয়।
জেমস বেটসন

6
আমার ক্ষেত্রে ত্রুটিটি চলে গেছে, তবে CSS শৈলীগুলি প্রয়োগ করা হয়নি ..: /
Andru

2
আমি এই সমস্যাটি সম্পর্কে আরও বেশি সময় ব্যয় করেছি এবং কোনও সিএসএস ফাইলের ধরন পরিবর্তন করে অন্য কিছু মারাত্মক সমস্যার কারণ হতে পারে, যেমন সিএসএস সার্ভারের দ্বারা এইচটিএমএল হিসাবে পড়া হয়
নিক

AngularDart এ, index.html এর মূলটি 'ওয়েব' ফোল্ডারটি প্রকল্পের মূল ফোল্ডার নয় not সুতরাং সমস্ত সিএসএস ফাইল অবশ্যই ওয়েব ফোল্ডারের ভিতরে থাকা উচিত। এই "[প্রকল্পফোল্ডার] \ ওয়েব [আপনারcssfileshere]" পছন্দ করুন। সুতরাং আপনি যদি ওয়েব ফোল্ডারের বাইরে অবস্থিত কোনও সিএসএস ফাইল আমদানির চেষ্টা করেন তবে এটি পাওয়া যাবে না।
ওয়াল

40

বুটস্ট্র্যাপ টেম্পলেটটির জন্য আমার এই ত্রুটি ছিল।

<link href="starter-template.css" rel="stylesheet">

তারপরে আমি rel="stylesheet"লিঙ্কটি থেকে অপসারণ করেছি , অর্থাত:

<link href="starter-template.css">

এবং সবকিছু ঠিকঠাক কাজ করে। আপনি যদি বুটস্ট্র্যাপ টেম্পলেট ব্যবহার করেন তবে এটি চেষ্টা করুন।


3
ভালো বল ধরা. ত্রুটি এখন চলে গেছে।
ধনী

1
মতে জীবনযাত্রার মান (4.2.4) , "একটি লিংক উপাদান পারেন একটি rel অ্যাট্রিবিউট অথবা একটি itemprop অ্যাট্রিবিউট, তবে দুটো একসাথে থাকতে হবে।" সুতরাং, relবৈশিষ্ট্যটি সরানো কেবল একটি স্টাইলশীট অন্তর্ভুক্ত করার কার্যকারিতা সরিয়ে দেয়।
আর্টজম বি।

এটি আশ্চর্যজনকভাবে আমার পক্ষে যথেষ্ট কাজ করেছে।

34

আমি আমার 'href' -> 'src' পরিবর্তন করেছি। সুতরাং এটি থেকে:

<link rel="stylesheet" href="dist/photoswipe.css">

এটি:

<link rel="stylesheet" src="dist/photoswipe.css">

এটা কাজ করেছে. আমি জানি না কেন, তবে এটি কাজটি করেছিল।


1
যদিও এটি আমার পক্ষেও কার্যকর হয়েছে, এটি কি কোনও বৈধ বৈশিষ্ট্য?
sr9yar

1
@ sr9yar আপনি ঠিক অনুযায়ী validator.w3.org এটা তাই এটি একটি দ্রুত hotfix হিসাবে ভাল হয়, কিন্তু যত তাড়াতাড়ি আপনি একটি বিট আরো সময় আছে যেমন আমি অন্য আরো জানতে সুপারিশ করবে, লিঙ্ক এ src আছে বৈধ নয় বৈধ কাজ।
সেবাস্তিয়ান ভোর

20

আপনার ফাইলে মন্তব্যগুলি এই ট্রিপ করবে। কিছু মিনিফায়ার মন্তব্য মুছে ফেলবে না।

করাও

আপনি যদি Node.js ব্যবহার করেন এবং আপনার স্ট্যাটিক ফাইলগুলি সেট করে expressযেমন:

app.use(express.static(__dirname + '/public'));

আপনার ফাইলগুলি সঠিকভাবে সম্বোধন করা দরকার।

আমার ক্ষেত্রে উভয়ই ইস্যু ছিল, তাই আমি আমার সিএসএস লিঙ্কগুলিকে "/css/styles.css" দিয়ে উপসর্গ করেছি।

উদাহরণ:

<link type="text/css" rel="stylesheet" href='/css/styles.css">

এই সমাধানটি নিখুঁত কারণ সিএসএসের রেন্ডারিং না পাওয়াই মূল সমস্যা


18

আমি কৌনিক.জসনে আমার কৌণিক 6 বিল্ড কনফিগারেশনের স্টাইল বিভাগে কেবল সিএসএস ফাইল (আমার ক্ষেত্রে একটি কৌনিক থিম) উল্লেখ করেছি:

এখানে চিত্র বিবরণ লিখুন

এটি প্রশ্নের উত্তর দেয় না, তবে এটি আমার পক্ষে যেমন উপযুক্ত ততটুকু হতে পারে।


3
অ্যাঙ্গুলার-সিএলআই 6 প্রকল্পের সঠিক উত্তরটি দেয়
টর্স্টেন বার্থেল

14

এই পোস্টে উল্লিখিত সমাধান হিসাবে, কিছু সমাধান আমার পক্ষে কাজ করেছে, তবে সিএসএস পৃষ্ঠায় প্রযোজ্য নয়।

সহজভাবে, আমি স্রেফ "এসএসএস" ডিরেক্টরিটি "এসেট /" ডিরেক্টরিতে স্থানান্তরিত করেছি এবং সবকিছু ঠিকঠাক কাজ করে।

<link rel="stylesheet" type="text/css" href="assets/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="assets/css/site.css" >

দুর্দান্ত (ওয়াই) আমার সমস্যাটি স্থির করেছে
চাকরী

12

এছাড়াও অন্যদের জন্য কৌণিক-সিএলআই ব্যবহার করে এবং ওয়েব সার্ভারে একটি সাব-ফোল্ডারে প্রকাশ করার জন্য, এই উত্তরটি দেখুন:

আপনি যখন কোনও ডোমেনের মধ্যে কোনও অ-রুট পাথ স্থাপন করছেন তখন আপনাকে নিজের ম্যানুয়ালি <base href="https://stackoverflow.com/">ট্যাগটি আপডেট করতে হবেdist/index.html.

এই ক্ষেত্রে, আপনাকে আপডেট করতে হবে <base href="https://stackoverflow.com/sub-folder/">

https://github.com/angular/angular-cli/issues/1080


10

যখন আমি লোকালহোস্ট এবং পিএইচপিস্টোরমে স্থানান্তরিত করি তখন অনলাইনে কাজ করা আমার জানা সাইটের সাথে আমার এই সমস্যা ছিল।

এটি অনলাইনে দুর্দান্ত কাজ করেছে:

    <link rel="stylesheet" href="/css/additional.css">

তবে লোকালহোস্টের জন্য আমাকে স্ল্যাশ থেকে মুক্তি পাওয়ার দরকার ছিল:

    <link rel="stylesheet" href="css/additional.css">

সুতরাং আমি ইতিমধ্যে এখানে সরবরাহ করা কয়েকটি উত্তরকে চাঙ্গা করছি - এটি কোনও জটিল সার্ভার সেটআপ সমস্যার পরিবর্তে কোনও পথ বা বানান ভুল হতে পারে। কনসোলে ত্রুটিটি একটি লাল রঙের হেরিং; নেটওয়ার্ক ট্যাবটি প্রথমে 404 এর জন্য পরীক্ষা করা দরকার।

এখানে প্রদত্ত উত্তরের মধ্যে কয়েকটি সমাধান রয়েছে যা সঠিক নয়। যোগে type="text/html"বা পরিবর্তন hrefকরতেsrc উত্তর নয়।

আপনি যদি সমস্ত বৈশিষ্ট্যাবলী রাখতে চান তাই এটি বৈধতা প্রদানকারীদের এবং আপনার আইডিইর বাছাইয়ের ক্ষেত্রে বৈধতা দেয় তবে মিডিয়া মান সরবরাহ করা উচিত এবং হওয়া relউচিত stylesheet, যেমন:

    <link rel="stylesheet" href="css/additional.css" type="text/css" media="all">

9

আমার সমস্যাটি হ'ল আমি ওয়েবপ্যাকটি ব্যবহার করছিলাম এবং আমার এইচটিএমএল সিএসএস লিঙ্কে আমার একটি আপেক্ষিক পথ ছিল এবং যে কোনও সময় আমি কোনও নেস্টেড পৃষ্ঠায় নেভিগেট করতাম, যা ভুল পথে চলে যাওয়ার সমাধান করবে:

<link rel="stylesheet" href='./index.css'>

এত সহজ সমাধান মুছে ফেলার জন্য ছিল .যেহেতু খনি একটি হল একক পৃষ্ঠার আবেদন

এটার মত:

<link rel="stylesheet" href='/index.css'>

সুতরাং এটি সর্বদা সমাধান করে /index.css


হ্যাঁ, আমার ক্ষেত্রে, আমি আমার সূচক html ফাইল থেকে এই আপেক্ষিক পাথগুলি সরিয়ে দিতে ভুলে গিয়েছিলাম এবং প্রোডাকশন মোডে ওয়েবপ্যাক চালাচ্ছিলাম। ওয়েবপ্যাকটি ওয়েবপ্যাক.প্রড.জেএস এর মাধ্যমে সিএসএস ফাইলগুলিকে ওয়েবপ্যাকের সাথে যুক্ত করার কারণে এই পাথগুলির প্রয়োজন হয় না।
কেওয়াল শাহ

9

আমি জানি এটি প্রাসঙ্গিকতার বাইরে নয় তবে একটি অস্তিত্বযুক্ত ফাইলের লিঙ্কিংয়ের ফলে এই সমস্যাটি হতে পারে যেমনটি আমার আগে হয়েছিল।

<!-- bootstrap grid -->
<link rel="stylesheet" href="./css/bootstrap-grid.css" />

যদি এই ফাইলটি বিদ্যমান না থাকে তবে আপনি সেই সমস্যার মুখোমুখি হবেন।


8

আমারও একই সমস্যা হয়েছে।

যদি আপনার প্রকল্পের কাঠামোটি নীচের গাছের মতো হয়:

index.html
assets
|-styles
  |-custom-style.css
server
  |- server.js

আমি নিম্নলিখিত কোডের টুকরোটিতে যুক্ত করার পরামর্শ দিচ্ছি server.js:

var path = require('path')
var express = require('express')
var app = express()

app.use('/assets', express.static(path.join(__dirname, "../assets")));

দ্রষ্টব্য: পাথটি একটি অন্তর্নির্মিত নোড.জেএস মডিউল, সুতরাং এনপিএমের মাধ্যমে এই প্যাকেজটি ইনস্টল করার দরকার নেই।


7

উত্তরের দীর্ঘ তালিকায় যোগ করার পরে, এই সমস্যাটি আমার সাথে ঘটেছিল কারণ আমি বুঝতে পারি নি যে ব্রাউজার-সিঙ্ক দৃষ্টিকোণ থেকে পথটি ভুল ছিল।

এই সাধারণ ফোল্ডার কাঠামো দেওয়া:

package.json
app
  |-index.html
  |-styles
      |-style.css

hrefঅ্যাট্রিবিউট ভিতরে <link>মধ্যে index.htmlহতে হয়েছে app/styles/style.cssএবংstyles/style.css


আসলে, পথে কেবল একটি টাইপো আমাকে এই একই ত্রুটি দিয়েছে।
জুলেসেজার

বাহ এটা আমার জন্য কাজ করেছে, আপনাকে অনেক ধন্যবাদ। আমি আক্ষরিকভাবে
হাল

7

আপনি গুগল ক্রোম সরঞ্জামগুলি খুলতে পারেন, নেটওয়ার্ক ট্যাবটি নির্বাচন করতে পারেন, আপনার পৃষ্ঠাটি পুনরায় লোড করুন এবং সিএসএসের ফাইলের অনুরোধটি খুঁজে পেতে পারেন এবং ফাইলের ভিতরে এটি কী আছে তা সন্ধান করতে পারেন।

আপনি সিএসএসের জন্য সঠিকভাবে না কিছু অক্ষর বা শিরোনাম সহ যখন আপনার ফাইলে দুটি গ্রন্থাগার একীভূত করেছিলেন তখন আপনি কিছু ভুল করেছিলেন?


1
দুর্ভাগ্যক্রমে আমি চেষ্টা করেছিলাম কিন্তু এটি সত্যই সহায়তা করছে না, অনুরোধটি তাত্ক্ষণিকভাবে ব্যর্থ হয় এবং এতে কেবল অনুরোধ ইউআরএল থাকে (যা সঠিক)
নিক

6

আপনি যদি কোনও জেএস ছাড়াই এক্সপ্রেস ব্যবহার করে চেষ্টা করেন:

app.use(express.static('public'));

উদাহরণ হিসাবে, আমার সিএসএস ফাইলটি এখানে রয়েছে public/stylesheets/app.css


5

নোড.জেএস অ্যাপ্লিকেশনটির জন্য আপনার সার্ভার ফাইলে প্রয়োজনীয় সমস্ত মডিউল আমদানি করার পরে এটি ব্যবহার করুন:

app.use(express.static("."));
  • এক্সপ্রেস.স্ট্যাটিক অন্তর্নির্মিত মিডলওয়্যার ফাংশন এক্সপ্রেসে এবং এটি আপনার .html ফাইলে: <link rel="stylesheet" href="style.css">

3
আপনি কি সর্বদা আপনার সার্ভার কোডটি জনগণের কাছে পরিবেশন করতে চান না?
কি জে

5

আমি একই সমস্যা পেয়েছি এবং তারপরে আমি যাচাই করেছিলাম যে আমি লিখেছি:

<base href="./"> ইনডেক্স। html এ

তারপরে আমি বদলে গেলাম

<base href="/">

এবং তারপরে এটি কাজ করে।



4

আমার ক্ষেত্রে, আমি যখন প্যাকেজটি লাইভ স্থাপন করছিলাম তখন আমার এটি সর্বজনীন এইচটিএমএল ফোল্ডারের বাইরে ছিল। এটি একটি কারণ ছিল।

তবে স্পষ্টতই একটি কঠোর এমআইএমআই টাইপ চেক সক্রিয় করা হয়েছে এবং এটি আমার পক্ষে বা যে সংস্থার সাথে আমি হোস্ট করছি তার দ্বারা আমি খুব বেশি নিশ্চিত নই।

তবে আমি সূচী.পিএফপি ফাইলের মতো একই ডিরেক্টরিতে স্টাইলিং ফোল্ডারটি সরিয়ে দেওয়ার সাথে সাথে আমি ত্রুটি পাওয়া বন্ধ করে দিয়েছি এবং স্টাইলিং পুরোপুরি সক্রিয় হয়ে গেছে।


4

বুটস্ট্র্যাপ শৈলী # 3411 লোড হচ্ছে না

https://github.com/angular/angular-cli/issues/3411

  1. আমি বুটস্ট্র্যাপ বনাম 3.3.7 ইনস্টল করেছি

    npm install bootstrap --save
  2. তারপরে আমি apps[0].scriptsকৌণিক-ক্লাই.জেসন ফাইলটিতে প্রয়োজনীয় স্ক্রিপ্ট ফাইলগুলি যুক্ত করেছি :

    "scripts": [
        "../node_modules/bootstrap/dist/js/bootstrap.js"
    ],
    
    // And the Bootstrap CSS to the apps[0].styles array
    
    "styles": [
        "styles.css",
        "../node_modules/bootstrap/dist/css/bootstrap.css"
    ],
  3. আমি এনজি সার্ভিস আবার চালু করেছি

এটা আমার জন্য কাজ করেছে।


4

ব্রাউজার যদি সম্পর্কিত সিএসএস ফাইল না খুঁজে পায় তবে এটি এই ত্রুটিটি দিতে পারে।

আপনি যদি কৌণিক অ্যাপ্লিকেশন ব্যবহার করেন তবে আপনাকে CSS.html এ CSS ফাইল পাথ রাখতে হবে না

 <link href="xxx.css" rel="stylesheet"> -->

আপনি স্টাইলএসএসএস ফাইলের সাথে সম্পর্কিত সিএসএস ফাইলের পাথ রাখতে পারেন।

@import "../node_modules/material-design-icons-iconfont/dist/material-design-icons.css";

এটি আমার জন্য স্থির ছিল, সূচি html থেকে লিঙ্কটি href সরান এবং স্টাইল.এসএসএসএস এ আমদানি পদ্ধতিটি ব্যবহার করেছিলেন।
আয়রন ওয়ার্কশপ

3

ইস্যুটির মূল কারণগুলির মধ্যে একটি হ'ল সিএসএস ফাইল যা লোড করার চেষ্টা করছে এটি কোনও বৈধ সিএসএস ফাইল নয়।

কারণসমূহ:

  • অবৈধ MIME প্রকার
  • স্টাইল শিটের ভিতরে জাভাস্ক্রিপ্ট কোড থাকা - (ভুল ওয়েবপ্যাক বান্ডলার কনফিগারেশনের কারণে ঘটতে পারে)

আপনি যে ফাইলটি লোড করার চেষ্টা করছেন তা যাচাই করুন একটি বৈধ সিএসএস স্টাইল শীট (নেটওয়ার্ক ট্যাব থেকে ফাইলটির সার্ভার URL টি পেয়ে একটি নতুন ট্যাবে চাপুন এবং যাচাই করুন)।

বডি ট্যাগের ভিতরে <লিঙ্ক> ব্যবহার করার সময় বিবেচনার জন্য দরকারী তথ্য info

যদিও linkদেহের অভ্যন্তরে কোনও ট্যাগ থাকা ট্যাগটি ব্যবহারের মানক উপায় নয়। তবে আমরা এটি পৃষ্ঠা অপ্টিমাইজেশনের জন্য ব্যবহার করতে পারি (আরও তথ্য: https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery ) / যদি ব্যবসায়ের ক্ষেত্রে কেসটি দাবি করে (আপনি যখন কনফিগার করা সামগ্রী এবং সার্ভারের শরীরে পরিবেশন করবেন) প্রদত্ত সামগ্রী সহ HTML পৃষ্ঠা রেন্ডার করতে হবে)।

শরীর ট্যাগ ভিতরে রাখার সময় আমরা অ্যাট্রিবিউট যোগ আছে itemPropertyমধ্যে linkমত ট্যাগ

<body>
    <!--  -->
      <link itemprop="url" href="http://en.wikipedia.org/wiki/The_Catcher_in_the_Rye" />
    <!--  -->
</body>`

Https://webmasters.stackexchange.com/questions/55130/can-i-use-link-tags-in-the-body-of-an-html-docament এitemProperty দেখুন আরও তথ্যের জন্য ।


3

আমার ব্রাউজারগুলিতে কনসোল> নেটওয়ার্ক> স্টাইল.সিএসএস এ গিয়ে ... এটি ক্লিক করে এবং এটি "পাথ / আমার / সিএসএসে পেতে পারে না" দেখায়, এটি আমার লিঙ্কটি ভুল বলেছিল। আমি এটি আমার সিএসএস ফাইলের পথে পরিবর্তন করেছি।

পরিবর্তনের পূর্বে আসল পথটি লোকালহোস্ট ছিল: 3000 / উদাহরণ / পাবলিক / স্টাইল। CSS এটিকে লোকালহোস্টে পরিবর্তন করা: 3000 / স্টাইল। CSS এটি সমাধান করেছে।

যদি আপনি অ্যাপ্লিকেশন থেকে ফাইলটি পরিবেশন করছেন (এক্সপ্রেস.স্ট্যাটিক (path.join (__ dirname, "সর্বজনীন"))); বা অ্যাপ.উজ (এক্সপ্রেস.স্ট্যাটিক ("পাবলিক"))); আপনার সার্ভারটি "সেই ফোল্ডারটি" ব্রাউজারে পাস করবে সুতরাং আপনার ব্রাউজারে একটি "/yourCssName.css" লিঙ্ক যুক্ত করে এটি সমাধান করে

আপনার ব্রাউজার সিএসএস লিঙ্কে অন্যান্য রুট যুক্ত করে আপনি ব্রাউজারকে নির্দিষ্ট রুটে সিএসএস অনুসন্ধান করতে বলছেন।

সংক্ষেপে ... আপনার ব্রাউজার সিএসএস লিঙ্কটি কোথায় নির্দেশ করে তা পরীক্ষা করুন।


2

আপনি যদি জাভাস্ক্রিপ্টে স্টাইলগুলি সেট করে থাকেন:

    var cssLink = document.createElement("link");
    cssLink.href = "./content.component.scss";
    cssLink.rel = "stylesheet";
   --> cssLink.type = "html/css";
    (iframe as HTMLIFrameElement).contentDocument.head.appendChild(cssLink);

তারপরে কেবল cssLint.type (উপরের বর্ণনায় তীর দ্বারা চিহ্নিত) "MIME" এ পরিবর্তন করুন:

   cssLink.type = "MIME";

এটি আপনাকে ত্রুটি থেকে মুক্তি পেতে সহায়তা করবে।


2

আপনি যখন প্রতিক্রিয়া বা কৌণিকর জন্য ক্লাইট সরঞ্জামটি ব্যবহার করছেন তখন এই সমস্যাটি ঘটে, সুতরাং মূল সরঞ্জামটি সম্পূর্ণ চূড়ান্ত বিল্ডটি অনুলিপি করা হয় যেহেতু তারা আরম্ভ করে যে তারা নিজস্ব লাইট সার্ভার যা আপনার ইউআরএলগুলি আপনার তৈরি ব্যাক এন্ড সার্ভারের সাথে বিভ্রান্ত করে uses ... পুরো বিল্ড ফোল্ডারটি নিন এবং এটি আপনার ব্যাক এন্ড সার্ভার প্রকল্পের সম্পদ ফোল্ডারে ফেলে দিন এবং আপনার পিছনের শেষ সার্ভার থেকে এটিকে সরিয়ে দিন এবং সার্ভারটি নয় যা কৌণিক বা রিএ্যাকটজ দিয়ে জাহাজে আনা হয় অন্যথায় আপনি এটিকে কোনও নির্দিষ্ট দিকের সম্মুখ প্রান্ত হিসাবে ব্যবহার করছেন এপিআই সার্ভার


2

আজুর বি 2 সি ব্যবহারকারীর প্রবাহে একটি কাস্টম চেহারা এবং অনুভূতি যুক্ত করার পরে আমি একই সমস্যাটি পেয়েছি। আমি যেটা খুঁজে পেয়েছি তা হল যে আমার মূল স্টোরেজ ববটির পরিবর্তে এইচটিএমএল পৃষ্ঠাটি মূলটি হ'ল ../oauth/v2 (অর্থাত্ ওউথ সার্ভার পাথ)।

পৃষ্ঠাগুলির পুরো url এ দেওয়া আমার জন্য সমস্যাটি স্থির করে।


2

আপনার কোনও সংক্ষেপণ সক্ষম বা অক্ষম আছে কিনা তা পরীক্ষা করুন। আপনি যদি এটি ব্যবহার করেন বা কেউ এটি সক্ষম করেapp.use(express.static(xxx)) সাহায্য করবে না। আপনার সার্ভার সংকোচনের অনুমতি দেয় তা নিশ্চিত করুন।

আমি যখন আমার ওয়েবপ্যাকটিতে ব্রটলি এবং সংক্ষেপণ প্লাগইন যুক্ত করেছি তখন আমি একইরকম ত্রুটি দেখতে শুরু করেছি। তারপরে আপনার সার্ভারকেও এই ধরণের সামগ্রী সংকোচনের সমর্থন করতে হবে।

আপনি যদি এক্সপ্রেস ব্যবহার করেন তবে নিম্নলিখিতগুলির সাহায্য করা উচিত:

app.use(url, expressStaticGzip(dir, gzipOptions)

মডিউলটি বলা হয়: এক্সপ্রেস-স্ট্যাটিক-জিজিপ

আমার সেটিংস হ'ল:

const gzipOptions = {
  enableBrotli: true,
  customCompressions: [{
  encodingName: 'deflate',
  fileExtension: 'zz'
 }],
 orderPreference: ['br']
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.