Comments (18)
It seems that there is a sub package for the docs site wrapped inside the main package. Should probably be split out and removed from the main package.
from material-ui.
We were trying to provide an easy way to test components in the docs site as we are building them. Maybe the confusion is not worth the convenience. Suggestions are welcome ...
from material-ui.
In your docs you do require('mui/Dialog')
, but this only works with require.js. If you use commonjs you might need to get messy and do require('../../src/Dialog')
instead (That's the reason I still use require js over browserify).
from material-ui.
Just pull mui
as Npm package in. That way the vendor folders position is fixed and it's easy to refer to it. The docs could as well just have a Gruntfile that has a concatenation or similar task to bundle everything in a file and remove the need to refer to folders multiple levels up or down.
from material-ui.
I concur with the refactor of the file structure. Keep your built version in /dist, dev source files in /src and keep website docs in /docs or similar. Using a file structure more like other react projects would go a long way toward encouraging others (such as myself) to contribute.
from material-ui.
Just make myself clear: I vote for a separate repo for the docs.
from material-ui.
👍
from material-ui.
This was definitely something that we struggled with. Here are the options as I understand it:
- Have 2 repos - 1 for docs and 1 for the npm distribution and reference the material-ui as an npm dependency from the docs site.
- Pros: Cleaner repo organization.
- Cons: We can't do active development in both project at once. Currently we're using the docs site to develop, test, and document the components quickly.
- Have 1 repo, but move the /dist folder to the root (outside of the docs folder). We actually tried this, but browserify-shim doesn't like references to folders outside its project folder. See - thlorenz/browserify-shim#61. We're using browserify-shim to include a syntax highlighting library for the docs site - https://highlightjs.org/. Maybe we just need to find some way to remove this dependency?
Are there any other options I'm missing? I'm open to suggestions.
Thanks for the feedback guys - we really appreciate it.
Hai
from material-ui.
I think you should have just one repo. In this way any commit will has docs and code match. If you have 2 repo try to match one with another, is a hell!
If you are at commit #xxx then you know your code matches that certain docs (if is done correctly, of course).
from material-ui.
I think I've got a fix for this in my fork (keeping everything in one repo); I was able to move the dist/ folder to the root of the project and fix the browserify shim to work with it existing in the new location. I can open up a pull request with my changes (PR #48).
from material-ui.
@BobertForever Thanks for the pull request. We actually discovered that there's an npm package for highlight.js that will allow us to remove the browser-shim dependency. We'll be releasing a fix for this issue here in the next couple hours.
from material-ui.
@totty90 Just set the version number in your package.json
to *
to get latest. Update via npm and you are fine. That's why we have package managers.
from material-ui.
When developing you use git and you will have 2 folders:
- material-ui-docs
- material-ui-code
All fine for now, but let's suppose I want to go back to commit X. I go into material-ui-code and go to commit X. There is no matching commit on the material-ui-docs repo. So I have to check the date of the commit X and find the last commit before that date. Now if you have multiple branches is even worse, should I look at branch A, B or C?
from material-ui.
Hi,
Found this while trying to make docs work independently from root folder. I just made some changes to package.json to include material-ui but I cant seem to make it even build...
I would like to see a mini how-to, maybe in README.md file in docs on how to make this folder work as an independent project, so I can start playing around and try to make a complex site.
Is there another example that I can take a look to? maybe a larger mockup?
Thanks!
from material-ui.
@Alderian Did you check out the example folder? https://github.com/callemall/material-ui/tree/master/example
from material-ui.
@hai-cea Yes I did, I found it very simple though. Docs project have a lot of different samples in code and it would be better for beginning a startup project and for learning purposes. Also tried to make changes in example to try to recreate the Docs project, but it didn't work, something important is missing, may be some dependencies.
May be there is no use on trying to do this on Docs project... that would also be a possible answer :) nevertheless if anyone can provide with some simple (or not) tasks to make Docs independent, it would be of real help.
[Off-topic] I'm trying to make a complex application, but I'm thinking of making an admin template using material-ui with MIT license, based on Docs as an example and as a learning material. Should I open a request for help? is there any similar project going on?
(Sorry for off topic here)
Thanks a lot!
from material-ui.
@Alderian I'm actually working on something like that myself.
I am basing my work on the current code of examples and docs. I can share it when it's sort of finished within the next few days
from material-ui.
I just made a fork and made some changes to make Docs work independent from root folder. I added steps to clarify steps needed
- https://github.com/Alderian/material-ui/
- https://github.com/Alderian/material-ui/blob/master/docs/README.md
I'm having big problems with svg-icons wherever they are used. I cannot find a way to make them work. The problem is that in original Docs, they are imported from material src folder directly, and I'm trying to use them directly as a component, just like any other from material-ui
I was thinking that we might need a svg-icons-index.jsx or something like in material-ui/src/svg-icons that include all icons in a module, just as Styles. But I still don't understand why svg-icons doen't work as any other module....
If I resolve this, I can make a pull request so that Docs might be easy separate to start a bigger project using it as template.
Thanks
PS. We might need a new issue...
from material-ui.
Related Issues (20)
- Add Repobeats (metrics) to README
- Type erros in `@mui/utils` HOT 1
- Module not found: Can't resolve '@emotion/react' in dual route (page,app) HOT 2
- [lab] Remove deprecated lab packages HOT 5
- [material-ui][Chip] Icon Not Centered When Only Icon is Provided HOT 4
- [material-ui][Select] Scroll inside select input HOT 4
- [material-ui] Move `CssVarsProvider` to `ThemeProvider` HOT 3
- [material-ui] Add Bento Grid component HOT 1
- [material-ui] Handling complex themes/palettes
- [docs] Routing Libraries List example contains deprecated `button` prop HOT 1
- Hydration error in next.js with MUI HOT 3
- getColorSchemeSelector returns the wrong selector when multiple are present HOT 1
- Label is not visible when using Select or Input components HOT 2
- @mui/material-nextjs@next does not work with @mui/[email protected]
- [material-ui][Autocomplete] Unexpected scrolling behaviour in virtualised custom Autocomplete component
- [material-ui][RadioGroup][FormControlLabel] onClick prop is called twice
- [material-ui][Autocomplete] Customize 'useAutocomplete' method based on the example provided
- Can'use Vietnamese keyboard in input field HOT 1
- MuiSvgIcon theme override doesn't work for width/height HOT 1
- [material-ui][Badge] When `showZero={false}` and value is `0` content is not updated HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from material-ui.