webpack搭建项目 (02)

最新推荐文章于 2024-08-11 20:55:15 发布

一苇流年

最新推荐文章于 2024-08-11 20:55:15 发布

阅读量104

点赞数

分类专栏： Webpack 文章标签： webpack

本文链接：https://blog.csdn.net/L_YW_/article/details/108887728

版权

Webpack 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

这篇博客展示了如何在HTML文件中引入React和Vue，创建基础组件并挂载到页面上。通过`ReactDOM.render()`在index.js中渲染React的`App`组件，而在Vue中则通过创建一个新的Vue实例并将数据和挂载元素指定。博客提供了启动项目的简单步骤。

摘要由CSDN通过智能技术生成

/** 接上一篇 **/

1. index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>test</title>
</head>
<body>
    <div id="app"></div>               // react
    //<div id="app">{{text}}</div>     // vue
    <script src='/dist/bundle.js'></script> 
</body>
</html>

3. React → index.js

import React from 'react';
import ReactDOM from 'react-dom';

class App extends React.Component {
  render() {
    return (
      <div>test</div>
    );
  }
}
ReactDOM.render(<App />, document.getElementById('app'));

3. Vue→ index.js

import Vue from 'vue';

new Vue({
    el: "#app",
    data: {
        text: 'test'
    },
})

/** 至此就可以启动了**/

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

一苇流年

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
webpack搭建项目 (02)

/** 接上一篇 **/1. index.html<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>test</title></head><body> <div id="app"></div> // react //<div id="app"&gt
复制链接

扫一扫