Web前端开发网

fly63.com

首页 资源 工具 文章 教程 栏目
  • 在线搜索
  • 文章标签
  • 广告合作
  • 赞助一下
  • 关于我们
资源推荐
必火AI
数字人一站式创作平台
码上飞(CodeFlying)
用一句话自动生成小程序、APP、H5网页应用
美图设计室
AI智能一键生成海报,免费平面设计
AI应用助手
一站式AI工具平台,为工作和学习提供智能解决方案
扣子Coze
职场AI,就用扣子
趣网商城
私密生活好物,隐私配送,无痕购物
AiPPT
全智能AI一键生成 PPT
豆包AI
字节跳动旗下 AI 智能助手
沁言学术
AI智能学术研究平台,覆盖科研全流程服务
SpeedAI
一键去重、降AIGC率、数据可视化、论文写作

资源分类

AI智能 酷站推荐 招聘/兼职 框架/库 模块/管理 移动端UI框架 Web-UI框架 Js插件 Jquery插件 CSS相关 IDE环境 在线工具 图形动效 游戏框架 node相关 调试/测试 在线学习 社区/论坛 博客/团队 前端素材 图标/图库 建站资源 设计/灵感 IT资讯
网站收录 / 问题反馈

vue-loader

分享
复制链接
新浪微博
QQ 好友

扫一扫分享

GitHub:https://github.com/vuejs/vue-loader
描述信息:用于Vue.js组件的Webpack loader
GitHub

vue-loader 是一个加载器,能把Vue 组件转化成JavaScript模块。vue-loader 提供了一些非常酷炫的特性:

  • ES2015默认可用;
  • 在每个 Vue 组件内支持其他的 Webpack 加载器,如用于<style>的 SASS 和用于<template> 的 Jade。
  • 把<style> 和 <template> 内引用的静态资源作为模块依赖项对待,并用Webpack 加载器处理。 
  • 对每个组件模拟有作用域的CSS。
  • 开发阶段支持组件的热加载。
    简单来说,webpack 和 vue-loader 的组合为你创作Vue应用的一个更先进、更灵巧的极其强大的前端开发模式。


Vue 组件

*.vue 文件是用户用 HTML-like 的语法编写的 Vue 组件。每个 *.vue 文件都包括三部分 <template>, <script> 和 <style>:

<template>
  <div class="example">{{ msg }}</div>
</template>
<script>
export default {
  data () {
    return {
      msg: 'Hello world!'
    }
  }
}
</script>
<style>
.example {
  color: red;
}
</style>

vue-loader 解析文件,提取每个语言块,让他们通过需要的其他 loaders ,最后组装起来,放回 CommonJS 的模块,此模块的 module.exports 就是个 Vue.js 组件对象。vue-loader 默认用没有用语言编译器,想CSS 预编译和HTML模板编译语言等,如果想用这些功能,需要设置 lang 属性的来实现。例如,你可以在组件的样式中这样用 SASS :

<style lang="sass">
  /* 编写 SASS! */
</style>



仅供个人学习参考/导航指引使用,具体请以第三方网站说明为准,本站不提供任何专业建议。如果地址失效或描述有误,请联系站长反馈~感谢您的理解与支持!

链接: https://fly63.com/nav/2742

更多»
热门资源
TypeScript
一种由微软开发的自由和开源的编程语言。它是JavaScript的一个超集
官网
GitHub
Vite
下一代前端开发与构建工具
官网
GitHub
webpack
webpack 是一个模块打包器。它的主要目标是将 JavaScript 文件打包在一起
官网
GitHub
npm
javascript 最流行的包管理器
官网
GitHub
yarn
可替代NPM的快速、可靠、安全的可信赖包管理工具Yarn
官网
GitHub
bower
解决js的依赖管理
官网
GitHub
grunt
基于Node.js的项目构建工具。它可以自动运行你所设定的任务
官网
GitHub
Parcel
快速,零配置的 Web 应用程序打包器
官网
GitHub
babel
Babel 是一个 JavaScript 编译器,可用下一代JavaScript 语法写代码
官网
GitHub
browserify
一个浏览器端代码模块化工具,require和module.exports来导入和导出.Browserify的原理:部署时处理代码依赖,将模块打包为一个文件。
官网
GitHub
Rolldown
Rust 驱动的高性能打包器
官网
GitHub
HEAD
一份你可以在 &lt;head&gt; 里设置的列表
官网
GitHub
类似于vue-loader的资源
Metro
针对 React Native的JavaScript模块打包器
官网
GitHub
Rspack
基于 Rust 的高性能模块打包工具
官网
GitHub
esbuild
一个用GO语言写的 Javascript 打包工具
官网
GitHub
critters
一个Webpack插件,用于内嵌关键的CSS并延迟加载其余的CSS
官网
GitHub
Pyodide
一款用于在浏览器端实现Python全栈科学计算
官网
GitHub
Docker
一个开源的应用容器引擎
官网
GitHub
yeoman
Google的团队和外部贡献者团队合作开发的,通过Grunt和Bower的包装为开发者创建一个易用的工作流
官网
GitHub
webpack-bundle-analyzer
Webpack包分析器
点击进入
GitHub
目录

手机扫一扫预览

》
分享组件加载中...
首页 技术导航 在线工具 技术文章 教程资源 前端标签 AI工具集 前端库/框架 实用工具箱 广告合作 关于我们

Copyright © 2018 Web前端开发网 All Rights Reserved. 提供免费在线工具、编程学习资源(教程/框架/库),内容以学习参考为主,助您解决各类实际问题,快速提升专业能力。