tdreact写helloworld

最新推荐文章于 2020-07-15 09:33:43 发布

一个脱离了高级趣味的人

最新推荐文章于 2020-07-15 09:33:43 发布

阅读量319

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_35555139/article/details/78784635

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1.如果没有npm需要先安装一下npm,
2.新建一个文件夹，新建以下文件，目录结构如下(.idea文件不需要)
这里写图片描述
3.上述文件内容如下
entry.js

import React,{ Component } from 'react';
import ReactDOM from 'react-dom';

export default class App extends Component{
    render(){
        return(
            <div>
                hello word!
            </div>
        );
    }
}

ReactDOM.render(
    <App/>,
    document.getElementById('example')
)

test.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="example"></div>

</body>
</html>

postcss.config.js

module.exports = {
        plugins: () => {
        return [
            require('postcss-nested')(),
            require('pixrem')(),
            require('autoprefixer')(is.Object(options) && is.Object(options.autoprefixer) ? options.autoprefixer : {
                browsers: ['last 2 versions', 'Firefox ESR', '> 1%', 'ie >= 8']
            }),
            require('postcss-flexibility')(),
            require('postcss-discard-duplicates')()
        ]
    }
};

app.js为空
4.进入这个项目文件夹，
依次执行
npm i tdtool -D
npm install tdtool-less
npm react
npm react-dom
npm tdtool-react
npm init -y
5.在package.json文件的”scripts”里面加上 “start”: “tdtool start”
6.执行tdtool start（在项目文件夹下）
7.在浏览器输入http://localhost:9090/
就可以看到你的helloword程序

包出現问题：
rm -rf node
rm -rf node_modules/
rm yarn.lock
yarn install