কিভাবে ভিজুয়াল স্টুডিও কোড সহ ব্রাউজারে একটি এইচটিএমএল ফাইল দেখতে হয়


265

নতুন মাইক্রোসফ্ট ভিজ্যুয়াল স্টুডিও কোড সহ আমি কীভাবে আমার ব্রাউজারে এইচটিএমএল কোড দেখতে পারি?

নোটপ্যাড ++ দিয়ে আপনার কাছে একটি ব্রাউজারে চালনার বিকল্প রয়েছে। আমি কীভাবে ভিজুয়াল স্টুডিও কোড দিয়ে একই জিনিস করতে পারি?


7
ভিএস কোডের এখন লাইভ সার্ভার এক্সটেনশন রয়েছে। দয়া করে আমার উত্তরটি দেখুন: স্ট্যাকওভারফ্লো.com
জোসে চেরিয়ান

3
লাইভ সার্ভার এক্সটেনশন আমার পক্ষে কাজ করেছিল। এটি করার জন্য কোনও ফাইল কনফিগার করতে চাই না।
এজিডিএম

এছাড়াও সম্পর্কিত: stackoverflow.com/questions/47519768/...
ford04

উত্তর:


209

উইন্ডোজের জন্য - আপনার ডিফল্ট ব্রাউজারটি খুলুন - ভিএস কোড বনাম 1.1.0 এ পরীক্ষিত

উভয় একটি নির্দিষ্ট ফাইল খোলার উত্তর (নামটি হার্ড-কোডেড) বা অন্য কোনও ফাইল খোলার জন্য।

পদক্ষেপ:

  1. কমান্ড প্যালেটটি খুলতে ctrl+ shift+ p(বা F1) ব্যবহার করুন ।

  2. Tasks: Configure Taskপুরানো সংস্করণে বা টাইপ করুন Configure Task Runner। এটি নির্বাচন করা হলে Tasks.json ফাইলটি খুলবে । প্রদর্শিত স্ক্রিপ্ট মুছুন এবং নিম্নলিখিত দ্বারা এটি প্রতিস্থাপন:

    {
        "version": "0.1.0",
        "command": "explorer",    
        "windows": {
            "command": "explorer.exe"
        },
        "args": ["test.html"]
    }

    আপনার ফাইলের নামে Tasks.json ফাইলের "আরগস" বিভাগটি পরিবর্তন করতে ভুলবেন না। আপনি F5 টি আঘাত করলে এটি সর্বদা নির্দিষ্ট ফাইলটি খুলবে।

    ["${file}"]"আরগস" এর মান হিসাবে ব্যবহার করে আপনি যে কোনও ফাইল খোলার জন্য আপনি এটি সেট করতে পারেন । নোট করুন যে এর $বাইরে যায় {...}তাই ["{$file}"]ভুল।

  3. ফাইলটি সংরক্ষণ করুন।

  4. সুইচ ফিরে আপনার HTML ফাইলে (এই উদাহরণে এটি "text.html" আছে), এবং প্রেস ctrl+ + shift+ + bআপনার ওয়েব ব্রাউজারে আপনার পৃষ্ঠাটি দেখতে।

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


16
এমনকি যদি আপনার একাধিক এইচটিএমএল ফাইল থাকে তবে আপনি ভেরিয়েবলগুলিও ব্যবহার করতে পারেন। আপনি করতে পারেন: "আরগস": ["{$ ফাইল}"] বর্তমান ওপেন ফাইলটি পাস করার জন্য। আরও দেখুন code.visualstudio.com/Docs/tasks#_variables-in-tasksjson
ডির্ক Bäumer

7
আমি ম্যাক এ কীভাবে করব? কোনও এক্সি ফাইল নেই। আমি ম্যাকের ক্রোমে ওয়েব পৃষ্ঠাগুলি খুলতে চাই
ইনভিজিবলডিভ

3
সবেমাত্র "বাহ্যিক প্রোগ্রাম ক্রোম $ $ ফাইল launch। স্প্যান ক্রোম
ENOENT

7
নতুন ফোল্ডারে টাস্কটি কনফিগার করতে: কার্যগুলি নির্বাচন করুন: টাস্ক রানার কমান্ডটি কনফিগার করুন এবং আপনি টাস্ক রানার টেম্পলেটগুলির একটি তালিকা দেখতে পাবেন। একটি টাস্ক তৈরি করতে অন্যকে নির্বাচন করুন যা একটি বাহ্যিক কমান্ড চালায়। । । । নিম্নলিখিত কন্টেন্ট সহ আপনার এখন আপনার ওয়ার্কস্পেস .vscode ফোল্ডারে একটি Tasks.json ফাইল দেখতে হবে :। । । Code.visualstudio.com/ ডকস
ইয়ং জিয়ান

5
কনফিগার টাস্ক রানার আর ভিএসসি 1.24.0 এ উপস্থিত নেই - কন্ট্রোল-শিফট-পি সেই স্ট্রিংয়ের কোনও ফলাফল দেয় না।
দীর্ঘতম

110

ভিএস কোডের একটি লাইভ সার্ভার এক্সটেনশন রয়েছে যা স্থিতি দণ্ড থেকে এক ক্লিক লঞ্চকে সমর্থন করে।

বৈশিষ্ট্যগুলির কয়েকটি:

  • স্ট্যাটাস বার থেকে এক ক্লিক লঞ্চ
  • লাইভ রিলোড করুন
  • ক্রোম ডিবাগিং সংযুক্তির জন্য সমর্থন

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


8
এই এক্সটেনশানের গতিশীল পৃষ্ঠাগুলিতে স্বয়ংক্রিয় পুনরায় লোড কার্যকারিতা সরবরাহ করতে একটি ওয়েব অ্যাড-অন রয়েছে।
এম। সান্দ্রস্রোম

@ এম। সংস্ট্রম আপনি কি আমাকে সেই অ্যাড-অনের নাম / লিঙ্ক দিতে পারেন?
আদিল সাজু

2
এখনও খুব দরকারী, এবং বিশেষত সম্পূর্ণরূপে কনফিগারেশন বিনামূল্যে!
জোনাস

2
জটিল পৃষ্ঠাগুলির জন্য এটি সম্ভবত নতুন কোডারদের জন্য ভাল নয়
ইয়াসার জারোফ

1
তবে মনে হচ্ছে আপনি সংরক্ষণ না করা সক্রিয় ফাইলটি সঠিকভাবে পর্যালোচনা করতে পারবেন না? (এটি চালানো, এইচটিএমএলটির পূর্বরূপ দেয় না, তবে ব্রাউজারে ফোল্ডার স্তরক্রমটি দেখায়)
জিনস্নু

73

@ ইনভিজিবলডিভ - এটি ব্যবহার করে ম্যাকের উপর কাজ করার জন্য:

{
    "version": "0.1.0",
    "command": "Chrome",
    "osx": {
        "command": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
    },
    "args": [
        "${file}"
    ]
}

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


32

আপনি যদি লাইভ রিলোডলোড করতে চান তবে আপনি গুল্প-ওয়েবসার্ভার ব্যবহার করতে পারেন যা আপনার ফাইলের পরিবর্তনগুলি এবং পুনরায় লোড পৃষ্ঠার জন্য নজর রাখবে, এইভাবে আপনাকে আপনার পৃষ্ঠায় প্রতিবার F5 চাপতে হবে না:

কিভাবে করতে হবে এখানে আছে:

  • কমান্ড প্রম্পট (সেন্টিমিটার) ও টাইপ করুন

    এনপিএম ইনস্টল - সেভ-ডেভ গল্প-ওয়েবসার্ভার

  • ভিএস কোডে সিটিআরএল + শিফট + পি লিখুন এবং টাস্ক রানার কনফিগার করুন টাইপ করুন । এটি নির্বাচন করুন এবং এন্টার টিপুন। এটি আপনার জন্য Tasks.json ফাইলটি খুলবে। এখান থেকে সবকিছু সরিয়ে ফেলুন কেবল নিম্নলিখিত কোডটি প্রবেশ করান

tasks.json

{
    "version": "0.1.0",
    "command": "gulp",
    "isShellCommand": true,
    "args": [
        "--no-color"
    ],
    "tasks": [
        {
            "taskName": "webserver",
            "isBuildCommand": true,
            "showOutput": "always"
        }
    ]
}
  • আপনার প্রকল্পের মূল ডিরেক্টরিতে gulpfile.js যুক্ত করুন এবং নিম্নলিখিত কোডটি প্রবেশ করুন:

gulpfile.js

var gulp = require('gulp'),
    webserver = require('gulp-webserver');

gulp.task('webserver', function () {
    gulp.src('app')
        .pipe(webserver({
            livereload: true,
            open: true
        }));
});
  • এখন ভিএস কোডে সিটিআরএল + শিফট + পি লিখুন এবং "রান টাস্ক" টাইপ করুন যখন আপনি এটি প্রবেশ করেন আপনি আপনার টাস্কটি "ওয়েবসারভার" নির্বাচিত দেখতে পাবেন এবং এন্টার টিপুন।

আপনার ওয়েবসভারটি এখন আপনার ডিফল্ট ব্রাউজারে আপনার পৃষ্ঠাটি খুলবে। এখন আপনি আপনার এইচটিএমএল বা সিএসএস পৃষ্ঠাগুলিতে যে পরিবর্তন করবেন তা স্বয়ংক্রিয়ভাবে পুনরায় লোড হবে।

উদাহরণ বন্দরটির জন্য কীভাবে 'গুলপ-ওয়েবসারভার' কনফিগার করতে হয় এবং কী পৃষ্ঠাটি লোড করা যায় সে সম্পর্কে এখানে একটি তথ্য ...

আপনি কেবল Ctrl + P লিখে টাস্ক ওয়েবসারভার টাইপ করে আপনার কাজটি চালাতে পারেন


2
আমাকে চালাতে হয়েছিল npm install -g gulp, npm install -g gulp-webserverএবং একটি NODE_PATH এনভায়রনমেন্ট ভেরিয়েবল যুক্ত করতে হবে যা আমার অ্যাপডাটা \ npm \ নোড_মডিউলগুলিতে নির্দেশ করে। তারপরে আমি ওয়েবসারভার টাস্কটি চালাতে সক্ষম হয়েছি, তবে ব্রাউজারটি শুরু হওয়ার পরে আমি একটি 404 পাই। আমি কি অনুপস্থিত কোন ধারণা?
কিরিল ওসেনকোভ

2
কিছু মনে করবেন না, কেবল আপনার উদাহরণে 'অ্যাপ' পরিবর্তন করতে হয়েছিল '' '। (সুতরাং এটি বর্তমান ডিরেক্টরি থেকে পরিবেশন করা হয়)।
কিরিল ওসেনকভ

1
উত্তরে একটি মন্তব্য: আপনি যদি ইওর ব্রাউজারে একটি এইচটিএমএল ফাইল চালাতে চান, যা স্বয়ংক্রিয়ভাবে পরিবর্তনগুলি পুনরায় লোড হয়ে যায়, আপনার gulpfile.js এর মতো দেখতে হবে, একটি 'দিয়ে।' পরিবর্তে 'অ্যাপ'। কোড = ভের গুল্প = প্রয়োজন ('গুল্প'), ওয়েবসারভার = প্রয়োজনীয় ('গল্প-ওয়েবসার্ভার'); gulp.task ('ওয়েবসারভার', ফাংশন () {gulp.src ('।') .পাইপ (ওয়েবসার্ভার ({ফলব্যাক: 'সূচক। html', লাইভরলোড: সত্য, ওপেন: সত্য}));});
Friis1978

1
এটা সত্যিই দারুন. এটি একটি মূল্যবান বিকল্প হিসাবে ব্যাখ্যা করার জন্য ধন্যবাদ। এই কাজটি পেতে আমি ক্রিল এবং ফরিসের উভয় উত্তর দুটিই প্রয়োগ করেছি। তবে তা করে!
klewis

আমি "GET /" পাচ্ছিলাম না কারণ আমি লাইনটি কনফিগার না করেই gulpfile.js অনুলিপি করেছিলাম gulp.src('app')যাতে এটি আসলে আমার উত্সের দিকে ইঙ্গিত করে (যা ছিল না /app'।')। নিখুঁত কাজ করে। ধন্যবাদ!

22

আপনি এখন ব্রাউজারে একটি এক্সটেনশন ভিউ ইনস্টল করতে পারেন । আমি এটি ক্রোমযুক্ত উইন্ডোতে পরীক্ষা করেছি এবং এটি কাজ করছে।

vscode সংস্করণ: 1.10.2

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


5
এই এক্সটেনশনটি ভয়াবহ পর্যালোচনা পায়।
জন ক্রোয়েল

এটি স্বয়ংক্রিয়ভাবে ব্রাউজারটি রিফ্রেশ করে না এবং এটি ওপি যা খুঁজছে তা নয়
জুড নিরোশন

17

লিনাক্সে, আপনি xdg-openডিফল্ট ব্রাউজার দিয়ে ফাইলটি খুলতে কমান্ডটি ব্যবহার করতে পারেন :

{
    "version": "0.1.0",
    "linux": {
        "command": "xdg-open"
    },
    "isShellCommand": true,
    "showOutput": "never",
    "args": ["${file}"]
}

6
ধন্যবাদ! আমি একজন লিনাক্স ব্যবহারকারী এবং হারিয়ে যাচ্ছিলাম। আমি এটি যুক্ত করতে চাই যে Ctrl + Shift + bএটি ব্রাউজারে চালু করার জন্য টিপতে হবে। আমার জন্য, স্তন্যপায়ীটি ছিল "বি = ব্রাউজার"। :-)
ankush981

এটি কাজ করে তবে অবহেলিত বলে মনে হচ্ছে, যদি আপনার একটি আপডেট সংস্করণ থাকে তবে আপনাকে ধন্যবাদ
ব্রুনো এল

17

Chrome ডাব্লু / কীবোর্ড শর্টকাটে বর্তমান নথির জন্য এখানে একটি 2.0.0 সংস্করণ রয়েছে:

tasks.json

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "Chrome",
            "type": "process",
            "command": "chrome.exe",
            "windows": {
                "command": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"
            },
            "args": [
                "${file}"
            ],
            "problemMatcher": []
        }
    ]
}

keybindings.json :

{
    "key": "ctrl+g",
    "command": "workbench.action.tasks.runTask",
    "args": "Chrome"
}

ওয়েবসভারে চলার জন্য:

https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer


14

ধাপ 1:

  1. ভিজ্যুয়াল স্টুডিও কোডটি খুলুন, তারপরে এক্সটেনশনে যান।
  2. "ব্রাউজারে খুলুন" অনুসন্ধান করুন। এখানে চিত্র বর্ণনা লিখুন

    এটি ইনস্টল করুন।

    ৪. আপনার এইচটিএমএল ফাইলটিতে সরাসরি ক্লিক করুন, আপনি "ব্রাউজারে খুলুন" বিকল্পটি পাবেন। এখানে চিত্র বর্ণনা লিখুন

    এখানেই শেষ................................................ ......


9

আমি কেবল msdnব্লগ থেকে যে পদক্ষেপগুলি ব্যবহার করেছি তা পুনরায় পোস্ট করছি । এটি সম্প্রদায়কে সহায়তা করতে পারে।

এই আপনি সেটআপ নামে পরিচিত একটি স্থানীয় ওয়েব সার্ভার সাহায্য করবে Lite-সার্ভার সঙ্গে VS Code, এবং এছাড়াও গাইডরা আপনাকে আপনার স্ট্যাটিক হোস্ট করার জন্য htmlফাইল localhostএবং debugআপনার Javascriptকোড।

1. নোড.জেএস ইনস্টল করুন

যদি ইতিমধ্যে ইনস্টল না হয় তবে এটি এখানে পান

এটি এনপিএম (আপনার বিকাশ লাইব্রেরিগুলি অর্জন এবং পরিচালনা করার জন্য প্যাকেজ পরিচালক) এর সাথে আসে

২. আপনার প্রকল্পের জন্য একটি নতুন ফোল্ডার তৈরি করুন

আপনার ড্রাইভের কোথাও আপনার ওয়েব অ্যাপ্লিকেশনের জন্য একটি নতুন ফোল্ডার তৈরি করুন।

৩. প্রকল্পের ফোল্ডারে একটি প্যাকেজ.জসন ফাইল যুক্ত করুন

তারপরে নিম্নলিখিত পাঠ্যটি অনুলিপি / অনুলিপি করুন:

{
   "name": "Demo",
   "version": "1.0.0",
   "description": "demo project.",
   "scripts": {
     "lite": "lite-server --port 10001",
     "start": "npm run lite"
   },
   "author": "",
   "license": "ISC",
   "devDependencies": {
     "lite-server": "^1.3.1"
   }
}

৪. ওয়েব সার্ভারটি ইনস্টল করুন

আপনার প্রকল্প ফোল্ডারে একটি টার্মিনাল উইন্ডোতে (উইন্ডোতে কমান্ড প্রম্পট) খোলে, এই কমান্ডটি চালান:

npm install

এটি লাইট-সার্ভার ইনস্টল করবে (প্যাকেজ.জসন সংজ্ঞায়িত), একটি স্থিতিশীল সার্ভার যা আপনার ডিফল্ট ব্রাউজারে সূচক html লোড করে এবং অ্যাপ্লিকেশন ফাইলগুলি পরিবর্তিত হলে স্বয়ংক্রিয়ভাবে তা রিফ্রেশ করে।

5. স্থানীয় ওয়েব সার্ভার শুরু করুন!

(ধরে নিলাম আপনার প্রকল্প ফোল্ডারে আপনার একটি index.html ফাইল রয়েছে)।

একই টার্মিনাল উইন্ডোতে (উইন্ডোজে কমান্ড প্রম্পট) এই কমান্ডটি চালান:

npm start

একটি দ্বিতীয় অপেক্ষা করুন এবং আপনার স্থানীয় ওয়েব সার্ভার দ্বারা পরিবেশন করা ডিফল্ট ব্রাউজারে index.html লোড হবে এবং প্রদর্শিত হবে!

লাইট-সার্ভার আপনার ফাইলগুলি দেখছে এবং আপনি কোনও এইচটিএমএল, জেএস বা সিএসএস ফাইলে পরিবর্তন করার সাথে সাথে পৃষ্ঠাটি রিফ্রেশ করে।

এবং আপনার যদি স্বয়ংক্রিয় সংরক্ষণের জন্য ভিএস কোড কনফিগার করা থাকে (মেনু ফাইল / অটো সেভ), আপনি টাইপ করার সাথে সাথে ব্রাউজারে পরিবর্তনগুলি দেখতে পাবেন!

মন্তব্য:

  • আপনার অ্যাপটিতে দিনের জন্য কোডিং শেষ না করা পর্যন্ত কমান্ড লাইন প্রম্পটটি বন্ধ করবেন না
  • এটি http: // লোকালহোস্ট: 10001 এ খোলে তবে আপনি প্যাকেজ.জসন ফাইল সম্পাদনা করে পোর্ট পরিবর্তন করতে পারবেন।

এটাই. এখন যে কোনও কোডিং সেশনের আগে এনপিএম শুরু টাইপ করুন এবং আপনি যেতে ভাল!

মূলত পোস্ট এখানে মধ্যে msdnব্লগ। ক্রেডিট লেখক যায়:@Laurent Duveau


6

আপনি যদি কেবল এই tasks.jsonফাইলটিতে ম্যাক থাকেন :

{
    "version": "0.1.0",
    "command": "open",
    "args": ["${file}"],
}

সাফারি-তে আপনার বর্তমান ফাইলটি খোলার জন্য আপনার কেবলমাত্র এটি দরকার ", এইচটিএমএল" এর এক্সটেনশন ধরে।

tasks.jsonউপরে বর্ণিত হিসাবে তৈরি করুন এবং এটি + shift+ দিয়ে প্রার্থনা করুন b

আপনি যদি এটি ক্রোমে খুলতে চান তবে:

{
    "version": "0.1.0",
    "command": "open",
    "args": ["-a", "Chrome.app", "${file}"],
}

এটি অ্যাপ্লিকেশনটি ইতিমধ্যে খোলা থাকলে কোনও নতুন ট্যাবে খোলার মতো আপনি যা করতে চান তা করবে।



4

1820 এপ্রিল 18 আপডেট হয়েছে

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

এই বাম-নীচে পরিচালনা আইকনে ক্লিক করুন । এক্সটেনশন বা শর্ট কাট ক্লিক করুনCtrl+Shift+X

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

এখন htmlফাইলটিতে ডান ক্লিক করুন এবং আপনি ব্রাউজারে ফাইলটি Ctrl+1দেখতে ডিফল্ট ব্রাউজারে বা শর্ট কাটে খোলা দেখতে পাবেন html


3

ম্যাকের জন্য - ক্রোমে খোলে - ভিএস কোড বনাম 1.9.0 এ পরীক্ষিত

  1. ব্যবহারের Command+ + shift+ + pকমান্ড প্যালেট খুলতে।

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

  1. টাস্ক রানার কনফিগার করুন টাইপ করুন, আপনি যখন প্রথমবার এটি করেন, ভিএস কোড আপনাকে "অন্যান্য" নির্বাচন না করে স্ক্রল ডাউন মেনু দেয় select আপনি যদি এর আগে এটি করেন তবে ভিএস কোড কেবল আপনাকে সরাসরি Tasks.json এ প্রেরণ করবে।

  2. একবার Tasks.json ফাইল এ। প্রদর্শিত স্ক্রিপ্ট মুছুন এবং নিম্নলিখিত দ্বারা এটি প্রতিস্থাপন:

{
    "version": "0.1.0",
    "command": "Chrome",
    "osx": {
        "command": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
    },
    "args": ["${file}"]
}
  1. আপনার HTML ফাইল এবং প্রেস পাল্টান ফিরে Command+ + Shift+ + bChrome এ আপনার পৃষ্ঠাটি দেখতে।

2

CTRL+SHIFT+Pকমান্ড প্যালেটটি নিয়ে আসবে।
আপনি অবশ্যই যা চালাচ্ছেন তার উপর নির্ভর করে। একটি এএসপি নেট অ্যাপের উদাহরণ আপনি টাইপ করতে পারেন:
>kestrelএবং তারপরে আপনার ওয়েব ব্রাউজারটি খুলুন এবং টাইপ করুন localhost:(your port here)

আপনি যদি >এটি টাইপ করেন তবে আপনাকে শো এবং রান কমান্ডগুলি প্রদর্শন করবে

অথবা আপনার এইচটিএমএলের ক্ষেত্রে, আমি মনে করি F5কমান্ড প্যালেটটি খোলার পরে ডিবাগারটি খোলা উচিত।

সূত্র: লিংক


আমি এই খোলার সামগ্রীটি

2

অপেরা ব্রাউজারে ফাইলগুলি খোলা হচ্ছে (উইন্ডোজ 64৪ বিটগুলিতে)। কেবল এই লাইনগুলি যুক্ত করুন:

{
"version": "0.1.0",
"command": "opera",
"windows": {
    "command": "///Program Files (x86)/Opera/launcher.exe"
},
"args": ["${file}"] }

"কমান্ড": লাইনে পাথ ফর্ম্যাটটিতে মনোযোগ দিন । "C: \ path_to_exe \ runme.exe" ফর্ম্যাটটি ব্যবহার করবেন না।

এই টাস্কটি চালানোর জন্য, আপনি দেখতে চান এইচটিএমএল ফাইলটি খুলুন, F1 টিপুন, টাস্ক অপেরা টাইপ করুন এবং এন্টার টিপুন


2

আমার রানার স্ক্রিপ্টটি দেখতে দেখতে:

{
    "version": "0.1.0",

    "command": "explorer",

    "windows": {
        "command": "explorer.exe"
    },

    "args": ["{$file}"]
}

এবং আমি যখন আমার সূচক html ফাইলে সিটিআরএল শিফট বি টিপব তখন এটি কেবল আমার এক্সপ্লোরারটি খুলবে


2

আপনি এখানে উইন্ডোজের জন্য একাধিক ব্রাউজারে এটি চালাতে পারেন

{
 "version": "0.1.0",
 "command": "cmd",
 "args": ["/C"],
 "isShellCommand": true,
 "showOutput": "always",
 "suppressTaskName": true,
 "tasks": [
     {   
         "taskName": "Chrome",
         "args": ["start chrome -incognito \"${file}\""]
     },
     {   
         "taskName": "Firefox",
         "args": ["start firefox -private-window \"${file}\""]
     },
     {   
         "taskName": "Edge",
         "args": ["${file}"]
     }   
    ]
}

লক্ষ্য করুন যে আমি প্রান্তের জন্য আরগসে কোনও কিছুই টাইপ করি নি কারণ এজ আমার ডিফল্ট ব্রাউজার হিসাবে কেবল ফাইলটির নাম দিয়েছে।

সম্পাদনা: এছাড়াও আপনার স্বতন্ত্র বা প্রাইভেট উইন্ডো দরকার নেই ... এটি কেবলমাত্র আমি এটি একটি ব্যক্তিগত উইন্ডোতে দেখতে চাই


আমি শুধু tasksঅংশ নকল করছিলাম । "args":["/C"]এই কাজ করে তোলে কি। কৌতূহলের বাইরে, এটি কী করে?
রায়ান বি

1

সম্প্রতি www.lynda.com- এ ভিজ্যুয়াল স্টুডিও কোড টিউটোরিয়ালের একটিতে এই বৈশিষ্ট্যটি জুড়ে এসেছিল

এম এর পরে সিটিআরএল + কে টিপুন, এটি "ভাষা নির্বাচন করুন মোড" খুলবে (বা ডান হাতের নীচে কোণায় ক্লিক করুন যা এই স্মাইলির আগে HTML বলে), মার্কডাউন টাইপ করুন এবং এন্টার টিপুন

এখন V এর পরে Ctrl + K টিপুন, এটি আপনার এইচটিএমএলটি কাছাকাছি ট্যাবে খুলবে open

তদা !!!

এখন আমার এইচটিএমএল ফাইলে এমমেট কমান্ডগুলি এই মোডে কাজ করছে না, তাই আমি মূল অবস্থায় ফিরে গিয়েছি (নোট - এইচটিএমএল ট্যাগ টেলিসেন্স পুরোপুরি কাজ করছে)

মূল অবস্থায় যেতে - M এর পরে Ctrl + K টিপুন, স্বতঃ-সনাক্তকরণ নির্বাচন করুন। এমমেট কমান্ডগুলি কাজ শুরু করে। আপনি যদি কেবল এইচটিএমএল দর্শকের সাথেই খুশি হন তবে আপনার আর আসল অবস্থায় ফিরে আসার দরকার নেই।

ভাবুন যে কেন ভিএসকোডের ডিফল্টরূপে এইচটিএমএল ভিউয়ার বিকল্প নেই, যখন এটি মার্কডাউন মোডে এইচটিএমএল ফাইলটি ডিসপ্লে করতে সক্ষম হয়।

যাইহোক এটি দুর্দান্ত। শুভ ভাস্কোডিং :)


1
প্রশ্নটি ব্রাউজারে কীভাবে দেখতে হয় সে সম্পর্কে।
ব্যবহারকারী5389726598465

1

এখানে ম্যাক ওএসএক্সের 2.0.0 সংস্করণ রয়েছে:

{
  // See https://go.microsoft.com/fwlink/?LinkId=733558
  // for the documentation about the tasks.json format
  "version": "2.0.0",
  "tasks": [
    {
      "label": "echo",
      "type": "shell",
      "command": "echo Hello"
    },
    {
      "label":"chrome",
      "type":"process",
      "command":"/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
      "args": [
        "${file}"
      ]
    }
  ]
}

0

Ctrl + F1 ডিফল্ট ব্রাউজারটি খুলবে। বিকল্পভাবে আপনি কমান্ড উইন্ডো খুলতে Ctrl + shift + P টিপুন এবং "ব্রাউজারে দেখুন" নির্বাচন করতে পারেন। এইচটিএমএল কোড অবশ্যই একটি ফাইলে সংরক্ষণ করতে হবে (সম্পাদকের অরক্ষিত কোড - এক্সটেনশন ছাড়াই, কাজ করে না)


1
আপনি ভিজ্যুয়াল স্টুডিও কোডটির কোন সংস্করণ ব্যবহার করছেন? এই কমান্ডগুলি আমার সদ্য আপডেট হওয়া 1.8.1 তে কাজ করছে না। Ctrl + F1 কিছুই করে না এবং কমান্ড প্যালেটটিতে আমার কাছে ব্রাউজার বিকল্প নেই। আপনার কার্যত.জসনে ডিফল্ট ইনস্টল করা বা অতিরিক্ত কাজগুলির বাইরে কিছু থাকতে পারে?
jla

আমার একই সংস্করণ রয়েছে তবে আমি বুঝতে পেরেছিলাম এটির জন্য আমি একটি এক্সটেনশন ইনস্টল করেছি। এটি হ'ল: মার্কেটপ্লেস.ভিউজুয়ালস্টুডিও.
com/…

0

সম্ভবত বেশিরভাগ উপরের উত্তরগুলি থেকে একটি সমাধান খুঁজে পেতে সক্ষম হবেন তবে কেউই কীভাবে আমার পক্ষে কাজ করেনি তা দেখে ( vscode v1.34) আমি ভেবেছিলাম আমার অভিজ্ঞতাটি ভাগ করে নেব। যদি অন্তত এক ব্যক্তি এটি সহায়ক খুঁজে বের করে তারপর, না একটি নষ্ট পোস্ট, ঠান্ডা amiirte ?


যাইহোক, আমার সলিউশন ( windows) @ নন্টজ এর শীর্ষে নির্মিত। তার কনফিগারেশনটি পুরানো সংস্করণগুলির জন্য পর্যাপ্ত হতে পারে vscodeতবে তা নয়1.34 এটির (কমপক্ষে, আমি এটি কাজ করতে পারিনি ..)।

আমাদের কনফিগারগুলি প্রায় একরকম সম্পত্তি সংরক্ষণ করে - সেই সম্পত্তি হ'লgroup সম্পত্তি। আমি নিশ্চিত না কেন তবে এটি ছাড়া আমার কাজ এমনকি কমান্ড প্যালেটে উপস্থিত হবে না।

তাই। চলমান ব্যবহারকারীদের tasks.jsonজন্য একটি কাজ :windowsvscode 1.34

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "Chrome",
            "type": "process",
            "command": "chrome.exe",
            "windows": {
                "command": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"
            },
            "args": [
                "${file}"
            ],
            "group": "build",
            "problemMatcher": []
        }
    ]
}

নোট করুন যে problemMatcherসম্পত্তিটি কাজ করার জন্য প্রয়োজনীয় নয় তবে এটি ছাড়া আপনার উপর অতিরিক্ত ম্যানুয়াল পদক্ষেপ চাপানো হয়। এই সম্পত্তিটিতে নথিগুলি পড়ার চেষ্টা করেছি তবে আমি বুঝতে খুব গভীর। আশা করি কেউ আমাকে নিয়ে স্কুল করবে কিন্তু হ্যাঁ, এর জন্য আগাম ধন্যবাদ advance আমি যা জানি তা হ'ল - এই সম্পত্তিটি অন্তর্ভুক্ত করুন এবং ctrl+shift+bবর্তমান htmlফাইলটি একটি নতুন chromeট্যাবে খুলুন, ঝামেলা মুক্ত।


সহজ।


0

প্রম্পট থেকে URL সহ কাস্টম ক্রোম খুলুন

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Open Chrome",
      "type": "process",
      "windows": {
        "command": "${config:chrome.executable}"
      },
      "args": ["--user-data-dir=${config:chrome.profileDir}", "${input:url}"],
      "problemMatcher": []
    }
  ],
  "inputs": [
    {
      "id": "url",
      "description": "Which URL?",
      "default": "http://localhost:8080",
      "type": "promptString"
    }
  ]
}

সক্রিয় ফাইল সহ কাস্টম ক্রোম খুলুন

{
  "label": "Open active file in Chrome",
  "type": "process",
  "command": "chrome.exe",
  "windows": {
    "command": "${config:chrome.executable}"
  },
  "args": ["--user-data-dir=${config:chrome.profileDir}", "${file}"],
  "problemMatcher": []
},

মন্তব্য

  • প্রয়োজনে প্রতিস্থাপন করুন windows অন্যান্য ওএস দ্বারা সম্পত্তি
  • প্রতিস্থাপন করা ${config:chrome.executable}আপনার কাস্টম ক্রোম অবস্থানের সাথে , যেমন"C:/Program Files (x86)/Google/Chrome/Application/chrome.exe"
  • ${config:chrome.profileDir}আপনার পণ্যদ্রব্য ক্রোম প্রোফাইল ডিরেক্টরিটি প্রতিস্থাপন করুন eg "C:/My/Data/chrome/profile" বা এটিকে ছেড়ে দিন
  • আপনি চাইলে উপরের মতো ভেরিয়েবল রাখতে পারেন। এটি করতে, settings.jsonব্যবহারকারীর বা কর্মক্ষেত্র - - এ নিম্নলিখিত প্রবেশকারীগুলি যুক্ত করুন , আপনার প্রয়োজনের সাথে পাথগুলি সামঞ্জস্য করুন:
"chrome.executable": "C:/Program Files (x86)/Google/Chrome/Application/chrome.exe",
"chrome.profileDir": "C:/My/Data/chrome/profile"
  • আপনি এই ভেরিয়েবলগুলি পুনরায় ব্যবহার করতে পারেন যেমন launch.jsonডিবাগিংয়ের উদ্দেশ্যে:"runtimeExecutable": "${config:chrome.executable}"
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.