I am managing a project where I am using Patternlab to manage the front-end styles and components, but would also like to share its SCSS directory on another Angular project that is the actual application.
Both are Git repos so my first thought was to use Git submodules, but being a Git novice I don't know if that's the best use case. I also thought about a private npm module, but not sure if that's right either.
Does anyone have experience sharing a common, version-controlled SCSS directory across multiple projects?
If both the projects can have the same version of SCSS directory all the time, it’s ok to use submodule. But usually we can’t make sure that. So submodule is not a good choice for this situation.
It’s better to manage SCSS directory in a single branch (we call SCSS branch here), when your project need the latest version of SCSS, you can merge SCSS branch into master branch.
Assume you want to share SCSS directory of projectA for projectB, you can use subtree to add SCSS branch for projectB. Detail as below steps (It's also suitable even you are not manage SCSS separately):
For projectA, create a SCSS branch to manage/develop SCSS directory separately (if you want to manage SCSS separately).
In projectB, add SCSS branch of projectA as a subtree:
git subtree add --prefix=SCSS/ <URL for projectA> SCSS
Modify/commit changes for SCSS folder in projectB.
If you want changes for SCSS also used for projectA, you can use:
git subtree push --prefix=SCSS/ <URL for projectA> SCSS
If you want to pull the changes of SCSS from projectA into projectB, you can use:
git subtree pull --prefix=SCSS/ < URL for projectA> SCSS
Related
I have few files in diferent folders (for example: tranlations..js, constants..js). I want to remove files from my build, because one customer doesn't need know about another customers, but you can see variables in Source page. So, i need to config build and remove files witch are for another customer, how I can do it by Vite in react app?
I didn't find solution or library that can help me
Boiler plate project created with create react app is 200MB+, with out us having wrote any code.
Most of the 200MB+ files is in the node_modules folder ( from all the lib it's downloaded). I can prevent re-download by installing most of the modules globally, but the modules still gets copied to the node_modules folder of the active project.
Is there a way to reduce the disk space size of my projects, ie. to have my active project reference the npm global libs directly as opposed to create a copy of the files in the node_modules folder.
What I've found so far:
'ejecting' create react app to customized: I didn't like dealing with
the mess of dealing with and having to maintain my own ejected
version of create react app.
ways to prevent download: share node.js modules across React apps? (install the lib globally)
I have a webpack react project. It runs only webpack, but I want to remove the webpack related matter and run as a normal react project.
webpack is just a bundler. It bundles all your js files and dump that as string in eval function in one single js file.
I Got your question now. I guess, you mean that you have a react project. Its developed now. And you want only the usefule files now, right? If thats the case, you need only two files(primarily for the project). First you build the project with whatever script you have, I guess, npm run build.
Post that, you will see a dist folder at the root.
Inside that dist folder you will find one index.html file and index.js file. Besides this you may want css and assets folder.
Does that answers your concern?
I understand that in react you cannot import files outside src folder.
But what is the reason for it exactly and can I disable it?
In my project react web app is only part of the whole thing, and different parts share some files (configs, build output), so folder structure looks like this
ProjectRoot/
config
build-output/
Part1/
Part2/
WebApp/
src/
...
Sure, you can copy files or create symlinks, but that's duplication and inconvenient.
This is a restriction of Create React App only.
This tool exists to get new users up and running with the react framework as fast as possible by abstracting away the tooling. The part of tooling that is limiting you in this instance is their webpack configuration, which is preset to only look for javascript files in your src directory.
That explains the why? but to answer the other half of your question:
how can I disable it?
Is that you would need to eject from Create React App and then modify your webpack config to allow it to search directories other than src/
First - this has nothing to do with react itself.
If you refer to importing javascript modules (for now using module loaders like systemjs, require, etc.) then the answer is:
It depends what directory is being served by web server. If you have set up your web server to serve WebApp/src folder only - then no, browser will not be able to get access to the files outside and so module loaders. If you will serve all ProjectRoot directory - then yes, you can.
If you prepare your web application for deployment using some sort of bundlers (webpack, browserify) - it depends on how you will configure them and instruct to include the required files in the resulting bundle.
I am setting up am Angular.js project from scratch. And I would like to keep it on Github inside a repository.
I have a simple question but I couldn't find a comprehensive answer for it. After establishing the project basic scaffold, and installing some node modules with NPM, there are many libraries, node-modules and etc in project structure. Also there are files of the framework for example Sails framework. Since a developer can install them by running npm install, which files should I push into the repository? Which ones don't need to be pushed?
The problem is, Source tree shows all new files as not staged, and I am confused which one I should exclude, which I should commit.
From personal experience, 2 types of files can be ignored in git
3rd party libraries, which can be installed using npm/bower etc.
Generated files, like css generated from less, minified js files, etc.
which files should I push into the repository?
Any files related to your application that contain business logic, routing, or other files that you've added to the project that are required for your app to run.
Which ones don't need to be pushed?
You should add node_modules to your .gitignore file. In almost all scenarios it would be unnecessary to include installed packages because your package.json maintains a list of packages to install when calling npm install.
If you're not sure about where to start with a .gitignore file, this is the defacto Node.js .gitignore file that is generated by GitHub & many popular IDE's. Just add that file to your project folder and git will automatically detect it, you should include your .gitignore as part of your repository files.
Additionally, if you're using Bower for front-end package management, you should add your bower.json to your repository and add the bower_components directory to your .gitignore.