首页 > 其他分享 >前端工程化基础

前端工程化基础

时间:2023-10-20 17:47:10浏览次数:30  
标签:vue 前端 基础 js 编译 html 组件 工程化

  1. 下载安装node.js
  2. npm install vue@latest
  3. 创建项目:vue ui
  4. 编译运行项目:npm run serve

vue组件结构(.vue文件)

三个标签组成:
<template>:模板部分,生成html代码
<script>:原生js代码,控制模板中数据的来源以及行为
<style>:控制css样式部分
开发网页时很少碰main.js与index.html而是开发vue组件

Element快速入门

image
https://element.eleme.cn/2.13/#/zh-CN/component/installation

Router Vue路由技术,根据#后的地址不同改变访问的组件

Nginx路由部署

Nginx文件目录

image

  1. build编译Vue项目
  2. 编译结果放到nginx的html目录下启动nginx,config可以更改占用的端口

标签:vue,前端,基础,js,编译,html,组件,工程化
From: https://www.cnblogs.com/adamaik/p/17777368.html

相关文章

  • web基础漏洞-xss
    1、介绍xss,crosssitescript跨站脚本攻击,是指攻击者构造payload,使其在用户的浏览器上解析为脚本执行,从而造成危害。脚本一般是指js,但广义上vbscript和actionscript(flash)等其它脚本可以造成xss。xss一般发生在浏览器,但广义上任何支持脚本解析的应用都有可能造成xss。危害是......
  • 零基础学习CAE——Hypermesh的使用技巧
    Hypermesh是一款强大的有限元前后处理软件,用于建模、网格划分、后处理和优化分析。以下是一些Hypermesh使用技巧:  1. 界面布局:在开始使用Hypermesh之前,可以调整界面布局以适应个人喜好。可以通过"View"菜单中的选项来自定义工具栏、视图和面板的位置和大小。 2. 快捷键......
  • python基础-数据类型(none、集合、字典、浮点数)
    目录1.了解hash2.None类型3.集合(set)3.1定义3.2独有功能3.3公共功能3.4转换3.5其他3.5.1集合的存储原理3.5.2元素必须可哈希3.5.3集合查找元素速度快3.5.4对比和嵌套集合练习题4.字典(dict)4.1定义4.2独有功能练习题4.3公共功能4.4转换4.5其他4.5.1存储原......
  • python基础-函数与模块1
    目录了解函数和模块1.文件操作1.1读文件1.2写文件1.3文件打开模式1.4常见功能读文件操作写文件操作1.5文件上下文管理练习题2.csv文件3.ini文件4.xml文件5.Excel文件5.1读Excel5.2写Excel6.压缩文件7.练习题了解函数和模块函数:一个用于专门实现某个功能的代码块,......
  • python基础-函数与模块2
    目录1.初识函数2.函数的参数2.1参数2.2默认参数2.3动态参数3.函数的返回值4.练习题1.初识函数面向过程编程:按照业务逻辑从上到下逐步完成函数式编程:利用函数编程函数,是一堆功能代码的集合def函数名():函数内编写代码......函数名()definfo(......
  • python基础-面向对象3
    目录1.继承补充1.1mro和c3算法1.2py2和py3继承区别2.内置函数补充3.异常处理3.1异常细分3.2自定义异常和抛出异常3.3finally和else3.3.1特殊的finally3.3.2else3.3.3traceback3.4异常练习题4.反射4.1一切皆对象4.2import_module+反射5.练习题1.继承补充......
  • python基础-面向对象2
    目录1.成员1.1变量1.2方法1.3属性2.成员修饰符3.对象嵌套4.特殊方法5.练习题1.成员面向对象中的所有成员如下:变量实例变量类变量方法绑定方法类方法静态方法属性1.1变量实例变量,属于对象,每个对象中各自维护自己的数据类变量,属于类,可以被所有对象......
  • python基础-数据类型(字符串-布尔-整数)
    目录1.整数(int)1.1定义1.2独有功能1.3公共功能1.4转换1.5其他1.5.1长整型1.5.2地板除1.5.3其它2.布尔(bool)2.1定义2.2独有功能2.3公共功能2.4转换2.5其他做条件自动转换3.字符串(str)3.1定义3.2独有功能3.2.1练习题3.3公共功能3.4转换3.5其他4.练习题......
  • 实验2— C语言分支与循环基础应用编程
    1.实验任务1源代码1#include<stdio.h>2#include<stdlib.h>3#include<time.h>45#defineN56#defineN13747#defineN246589intmain()10{11intnumber;12inti;1314srand(time(0));1516for......
  • 实验2 C语言分支与循环基础应用编程
    摘要一、实验目的二、实验准备三、实验内容四、实验结论 task1源代码:1#include<stdio.h>2#include<stdlib.h>3#include<time.h>4#defineN55#defineN13746#defineN246578intmain()9{10intnumber;11inti;12srand(time(0));......