Giter Site home page Giter Site logo

starter kit about vidom HOT 6 OPEN

LexRiver avatar LexRiver commented on June 9, 2024
starter kit

from vidom.

Comments (6)

dfilatov avatar dfilatov commented on June 9, 2024

Hi, @LexRiver!
Could you investigate after which version it appears? Probably it's a bug.

from vidom.

LexRiver avatar LexRiver commented on June 9, 2024

No, seems like it's some error in my webpack config.
Because I can import .jsx files without any error.

Now I've switched to rollup and it works for me.

from vidom.

dfilatov avatar dfilatov commented on June 9, 2024

Here's a part of my webpack config for processing tsx files:

{
    test: /\.tsx$/,
    use: [
        {
            loader: 'babel-loader',
            options: {
                plugins: [['babel-plugin-vidom-jsx', { autoRequire: false }]]
            }
        },          
        {
            loader: 'ts-loader',
            options: {
                transpileOnly: true,
                compilerOptions: {
                    sourceMap: true,
                    importHelpers: true,
                    jsx: 'preserve'
                }
            }
        }
    ]
}

from vidom.

LexRiver avatar LexRiver commented on June 9, 2024

yes, it seems to work now, but I have a runtime error
Uncaught ReferenceError: vidom is not defined
unless I add a script reference in my html:
<script src="https://unpkg.com/[email protected]/dist/vidom.js"></script>
is it the way it should be?

from vidom.

dfilatov avatar dfilatov commented on June 9, 2024

No, it isn't. You need to import vidom in tsx files.

// MyComponent.tsx

import * as vidom from 'vidom';

class MyComponent extends vidom.Component {
    onRender(): vidom.Node {
        return (
            <div>content</div>
        );
    }
}

from vidom.

LexRiver avatar LexRiver commented on June 9, 2024

vidom-test-webpack.zip
Here I'm trying to create minimal possible project, can you please check?

from vidom.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.