Skip to content

Auto-Completion in inline handlebars script #722

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
nikolailehbrink opened this issue Mar 3, 2023 · 1 comment · Fixed by #726
Closed

Auto-Completion in inline handlebars script #722

nikolailehbrink opened this issue Mar 3, 2023 · 1 comment · Fixed by #726
Assignees

Comments

@nikolailehbrink
Copy link

What version of Tailwind CSS IntelliSense are you using?

v0.9.7

What version of Tailwind CSS are you using?

v3.2.4

What package manager are you using?

npm

What operating system are you using?

macOS

Tailwind config

const defaultTheme = require("tailwindcss/defaultTheme");
const colors = require("tailwindcss/colors");

module.exports = {
  content: ["./**/*.{html,js}"],
  theme: {
    container: {
      center: true,
      padding: {
        DEFAULT: "1rem",
        lg: "6rem",
      },
    },
    colors: {
      transparent: "transparent",
      white: "#FFFFFF",
      black: "#000000",
      current: "currentColor",
      dark: colors.dark,
      inherit: colors.inherit,
      current: colors.current,
      red: {
        DEFAULT: "#E30613",
        50: "#FED1D3",
        100: "#FDB8BC",
        200: "#FC868D",
        300: "#FA555E",
        400: "#F9232F",
        500: "#E30613",
        600: "#B1050F",
        700: "#80030B",
        800: "#4E0207",
        900: "#1C0102",
      },
      violet: {
        DEFAULT: "#A71B71",
        50: "#F3B5DB",
        100: "#EF9FD0",
        200: "#E873BB",
        300: "#E147A6",
        400: "#D3228F",
        500: "#A71B71",
        600: "#7B1453",
        700: "#4F0D36",
        800: "#230618",
        900: "#000000",
      },
    },
    extend: {
      fontFamily: {
        urw: ["urw-form", ...defaultTheme.fontFamily.sans],
      },
    },
  },
  plugins: [],
};

VS Code settings

{
    "tailwindCSS.includeLanguages": {
        "javascript": "javascript",
        "html-eex": "html",
        "plaintext": "html",
        "Handlebars": "html"
    }
    
}

Reproduction URL

<div id="template" class="w-4/5 swiper-wrapper lg:w-2/3">
  <script id="output" type="text/x-handlebars-template">
    {{#each images}}
      <div class="swiper-slide">
        <div class="swiper-carousel-animate-opacity">
          <img class="bg-red" src="{{url}}" alt="{{alt}}" />
        </div>
      </div>
    {{/each}}
  </script>
</div>

Describe your issue

I am trying to get the TailwindCSS IntelliSense working inside an inline script. I am using handlebars in a simple One-Pager, however the autocompletion doesn't work in side the script tag.

@bradlc
Copy link
Contributor

bradlc commented Mar 13, 2023

Hey @nikolailehbrink. As of v0.9.8 IntelliSense will now work in text/x-handlebars-template scripts 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants