这是一个基于sass和tailwindcss的快速开发传统多页面的npm脚手架。

package.json

{
"name": "sass-tailwindcss-start",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "concurrently 'npm:start-sass' 'npm:start-tailwindcss' 'npm:start-dotnet'",
"build": "npm run build-sass && npm run build-tailwindcss",
"start-dotnet": "dotnet watch",
"start-tailwindcss": "npx tailwindcss -i ./wwwroot/scss/style.css -o ./wwwroot/css/style.css -w",
"build-tailwindcss": "npx tailwindcss -i ./wwwroot/scss/style.css -o ./wwwroot/css/style.css -m",
"start-sass": "sass ./wwwroot/scss/index.scss ./wwwroot/scss/style.css -w",
"build-sass": "sass ./wwwroot/scss/index.scss ./wwwroot/scss/style.css"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"autoprefixer": "^10.4.2",
"concurrently": "^7.0.0",
"postcss": "^8.4.6",
"sass": "^1.49.7",
"tailwindcss": "^3.0.22",
"@tailwindcss/forms": "^0.4.0",
"@tailwindcss/line-clamp": "^0.3.1"
}
}

tailwind.config.js

module.exports = {
content: ["./Pages/**/*.cshtml"],
theme: {
extend: {},
},
plugins: [require("@tailwindcss/line-clamp"), require("@tailwindcss/forms")],
};

推荐一个基于Tailwindcss和bootstrap动效的基础开发库:

https://tailwind-elements.com/quick-start/

基于sass tailwindcss的传统页面开发脚手架的更多相关文章

  1. 基于vue-cli的改造的多页面开发脚手架

    项目的GitHub地址:https://github.com/hellobajie/vue-cli-multipage 该脚手架同时支持vux,scss,less 目录结构 vue-cli-multi ...

  2. 基于Vue2.0的单页面开发方案

    2016的最后一天,多多少少都应该总结一下这一年的得失,哪里做的好,哪里需要改进,记一笔,或许将来会用到呢. 毕业差不多半年了,一直是一个人在负责公司项目的前端开发与维护,当时公司希望前后端分离,提高 ...

  3. X5的UI部分和传统Web页面开发的差异

    http://doc.wex5.com/different-with-std-web-ui/#1 X5的UI部分和传统Web页面开发的差异 WeX5是跨端移动开发框架,BeX5是基于WeX5的企业快速 ...

  4. 基于weex的app开发脚手架weexplus学习笔记

    认识weexplus weexplus是基于weex官方的二次开发版本,weex和react native一样同属第2代跨平台技术,解决了第一代性能低下,体验不好的问题,同时保留了第一代 多平台一套代 ...

  5. 基于.NetCore开发博客项目 StarBlog - (6) 页面开发之博客文章列表

    系列文章 基于.NetCore开发博客项目 StarBlog - (1) 为什么需要自己写一个博客? 基于.NetCore开发博客项目 StarBlog - (2) 环境准备和创建项目 基于.NetC ...

  6. 基于.NetCore开发博客项目 StarBlog - (7) 页面开发之文章详情页面

    系列文章 基于.NetCore开发博客项目 StarBlog - (1) 为什么需要自己写一个博客? 基于.NetCore开发博客项目 StarBlog - (2) 环境准备和创建项目 基于.NetC ...

  7. AgileBoot - 基于SpringBoot + Vue3的前后端快速开发脚手架

    AgileBoot 仓库 后端地址:https://github.com/valarchie/AgileBoot-Back-End 技术栈:Springboot / Spring Security / ...

  8. Gumby – 基于 Sass 的灵活的,响应式 CSS 框架

    Gumby 框架是一个基于 SASS 的灵活的,响应式的 CSS 框架.可以借助其灵活,响应式的网格系统和 UI 套件快速创建逻辑的页面布局和应用程序原型. 您可能感兴趣的相关文章 35个让人惊讶的 ...

  9. 基于NodeJS的全栈式开发

    前言 为了解决传统Web开发模式带来的各种问题,我们进行了许多尝试,但由于前/后端的物理鸿沟,尝试的方案都大同小异.痛定思痛,今天我们重新思考了“前后端”的定义,引入前端同学都熟悉的 NodeJS,试 ...

  10. 也谈基于NodeJS的全栈式开发(基于NodeJS的前后端分离)

    前言 为了解决传统Web开发模式带来的各种问题,我们进行了许多尝试,但由于前/后端的物理鸿沟,尝试的方案都大同小异.痛定思痛,今天我们重新思考了“前后端”的定义,引入前端同学都熟悉的NodeJS,试图 ...

随机推荐

  1. 01 Eclipse使用Maven慢的问题解决

    1. Eclipse 使用的是内置的 Maven Eclipse 有可能使用了内置的 Maven,而不是独立安装的 Maven.如果使用 Eclipse 内置的 Maven,默认的 settings. ...

  2. SpringBoot之后端图形验证码实现

    此验证码的实现没有用到太多的插件,话不多说直接上代码,大家拿过去就可以用. 1.验证码类 package com.youyou.login.util.validatecode; import lomb ...

  3. 详解 Hough 变换(基本原理与直线检测)

    Hough 变换原理与应用 前言: 详细介绍了 Hough 变换的基本思想.基本原理和应用等.其中大多都是自己的理解,难免有偏差,仅供参考. 文章目录 Hough 变换原理与应用 1. 基本概述 1. ...

  4. C221110C. SolarPea与网格

    C221110C. SolarPea与网格 是怎么想到dp定义的? 思考下面这个情景: 如果一个人在 \(x\), 另一个人在 \(y \ (x \lt y)\), 那么在 \(x\) 的人会把 \( ...

  5. Nginx支持https访问

    为了提高web应用的安全性,现在基本上都需要支持https访问.在此记录一下自己在nginx下的配置过程 安装Nginx这里就省略了 安装openssl模块 yum -y install openss ...

  6. 一文彻底弄懂Spring Boot的启动过程

    一,Spring Boot启动过程 1. 启动入口 Spring Boot 应用的启动入口通常是一个包含 @SpringBootApplication 注解的主类,并调用 SpringApplicat ...

  7. Python 提取PowerPoint文档中的图片

    如果你需要在多个PowerPoint演示文稿中使用相同的图片,直接从原始PPT中提取并保存图片可以避免重复寻找和下载.此外,将PPT中的重要图片提取出来可以将其作为备份,以防原文件损坏或丢失.本文将通 ...

  8. IDEA常用插件推荐

    IDEA支持特别多的插件,今天记录一下我常用的插件.欢迎在评论区推荐更多插件!!! 1.Translation - 必备翻译插件 基于 IntelliJ 的 IDE 的翻译插件 推荐指数: 插件链接: ...

  9. 鸿蒙开发Hvigor任务简介

    编译构建工具DevEco Hvigor(以下简称Hvigor)是一款基于TS实现的构建任务编排工具,主要提供任务管理机制,包括任务注册编排.工程模型管理.配置管理等关键能力,提供专用于构建和测试应用的 ...

  10. PC自动化之pywinauto

    官方文档: https://pywinauto.readthedocs.io/en/latest/contents.html [安装] pip install pywinauto [使用] from ...