这是一个基于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. 字符串、列表、元组、字典(python)

    文章目录 1.python字符串 1.1 python访问字符串中的值 1.2Python 字符串连接 1.3Python字符串运算符 2.python列表 2.1访问列表中的值 2.2更新列表 2. ...

  2. 【原创】dell戴尔笔记本充电头4530改装typeC口过程记录笔记本电源改装c口三路接线定义指南(图解)

    在淘宝淘一个备用笔记本电脑,要求便携能用,最重要便宜(如果不便宜买了就想高价卖了) 选择了xps13 L322x,键盘屏幕有瑕疵,打折下来价格170左右,换了个键盘20.整体重量1.3kg左右,大小A ...

  3. 用Java实现samza转换成flink

    将Apache Samza作业迁移到Apache Flink作业是一个复杂的任务,因为这两个流处理框架有不同的API和架构.然而,我们可以将Samza作业的核心逻辑迁移到Flink,并尽量保持功能一致 ...

  4. Java基础语法闪过——纯小白

    Java语法突击 笔者因为学校奇葩选课原因,需要学习Java,考试所迫和大伙一起交流复习下基础的语法内容,大家都一把拿下考试 观前提醒:本文整理的有些仓促了,简单几分钟看看Java有什么内容还好,如果 ...

  5. 剖析Air724UG的硬件设计,有大发现?02篇

    ​ 3.8 I2C 管脚名 类型 序号 电压域 描述 I2C2_SCL IO 32 V_GLOBAL_1V8 I2C2 时钟信号,用作 I2C 时需外加 1.8V 上拉 I2C2_SDA IO 31 ...

  6. 【一步步开发AI运动小程序】十七、如何识别用户上传视频中的人体、运动、动作、姿态?

    [云智AI运动识别小程序插件],可以为您的小程序,赋于人体检测识别.运动检测识别.姿态识别检测AI能力.本地原生识别引擎,内置10余个运动,无需依赖任何后台或第三方服务,有着识别速度快.体验佳.扩展性 ...

  7. 鸿蒙开发Hvigor插件动态生成代码

    Hvigor允许开发者实现自己的插件,开发者可以定义自己的构建逻辑,并与他人共享.Hvigor主要提供了两种方式来实现插件:基于hvigorfile脚本开发插件.基于typescript项目开发.下面 ...

  8. 2020-2024 Rider安装+激活

    一.下载 1. rider各版本官方下载入口 rider官网下载地址 2. 选择左边,然后点击[20xx.x.x-Windows(exe)] PS: 如需下载特定版本,可以往下拉,都是选择[202x. ...

  9. vue之vuex使用

    如图所示,它是一个程序里面的状态管理模式,它是集中式存储所有组件的状态的小仓库,并且保持我们存储的状态以一种可以预测的方式发生变化.对于可以预测,现在我不多做说明,相信在看完这篇文章之后,你就会有自己 ...

  10. DevEco Studio:状态管理与事件处理

    DevEco Studio:状态管理与事件处理 引言 在现代前端开发中,状态管理和事件处理是构建交互式应用的核心.DevEco Studio,作为华为推出的开发环境,支持开发者使用TypeScript ...