I want to setup a yarn workspace monorepo structure to my project, below is the basic structure.
Main
- packages
- Auth
- package.json
- Site1
- package.json
- Site2
- package.json
- package.json
/* Main/package.json */
{
"private": true,
"name": "Main",
"workspaces": ["./packages/*"]
}
I want to add the #Main/Auth packages dependency to #Main/Site1 and #Main/Site2. I have tried this
yarn workspace Site1 add Auth
It's giving the error:
An unexpected error occurred: "https://registry.yarnpkg.com/#Main/Auth: Not found".
PS: I have just added #Main as a prefix to make this less common.
It appears from looking at the Yarn docs, you don't issue a yarn command or anything, you just manually build the package.json files by hand.
So, inside Site/package.json you would put something like:
{
"name": "#Main/Site1",
"version": "1.0.0",
"private": true,
"dependencies": {
"#Main/Auth": "^1.0.0"
}
}
Related
Maybe I didn't understand correctly how to use vite.
I am working with Laravel 9. I have created a package in "packages/mypackage" for my project, and I would like to use vite separately for this subfolder.
When I run "npm run build", It works correctly, generating a public folder in the package, with its own manifest.json.
The main problem is when I want to load those files in a blade view.
My public/build/manifest inside the package:
{
"themes/custom/scss/styles.scss": {
"file": "assets/styles-9b1f12cb.css",
"src": "themes/custom/scss/styles.scss",
"isEntry": true
},
"themes/custom/js/scripts.js": {
"file": "assets/scripts-4ed993c7.js",
"src": "themes/custom/js/scripts.js",
"isEntry": true
}
}
But when I use vite in blade with
#vite(['themes/custom/js/scripts.js', 'themes/custom/scss/styles.scss'])
Chrome shows an exception:
Unable to locate file in Vite manifest: themes/custom/js/scripts.js.
Could someone help me to figure out what I'm doing wrong?
Thanks!
I'm trying to create a project with composer-file.
Reason is primarily a dependency which I never want to upload to git.
My intended structure is this:
project-root-folder
- project-sub-folder(s)
- vendor (with required dependencies)
- index.php
- composer.json
- README.md
But the installed structure using composer is this:
project-root-folder
- vendor
- vendor/composer
- vendor/smarty (dependency)
- vendor/my-project
- composer.json
I know that there are special installers for many different projects, I just don't understand that an installer is required to get the intended structure and also not how to do it without a special installer.
This is the content of one composer file I tried:
{
"name": "wdb/tutorial-oop",
"require": {
"smarty/smarty": "~3.1"
}
}
When I tried this composer-json content in a local file and just extecute composer install I get the same structure:
{
"require": {
"wdb/tutorial-oop": "dev-master"
}
}
So my question is, how a composer file has to look that the project structure is created like I described in the top of this question. The basic problem is that I don't want my project being installed as dependency in the vendor-directory but in the root of the project folder, and additionally that I don't want to use the composer autoloader.
Edit:
On request here my full composer file inside the project root:
{
"name": "wdb/tutorial-oop",
"type": "project",
"description": "Your package description goes here",
"keywords": ["oop","mvc","tutorial"],
"homepage": "https://barlians.com",
"license": "GPL-3.0-or-later",
"authors": [
{
"name": "David Bruchmann",
"email": "david.bruchmann#gmail.com",
"homepage": "https://barlians.com",
"role": "Author, Developer"
}
],
"support": {
"email": "david.bruchmann#gmail.com"
},
"require": {
"smarty/smarty": "~3.1"
}
}
You're installing your project in incorrect way. The composer require command is for installing dependencies, so they're installed to the vendor directory.
For installing a project you should use the create-project command:
composer create-project wdb/tutorial-oop
Is was wondering if its possible to deploy a React Native app to Heroku? The reason I ask is because then I can retrieve the url and place it in an iframe to mimic an iPhone where the user can then tryout the app without actually having to install it on to the iPhone via iTunes.
This is possible using react-native-web (sources).
There are few things that you have to do to set this up on heroku:
in the settings tab of your your heroku app dashboard
set the buildpack as heroku/nodejs,
in package.json set the build script to build your web version from RN sources, for example, if you are using expo: expo build:web,
create a Procfile in the root directory to serve the web
version: for example, if you used expo, the build directory is web-build and therfore the command should be npx serve web-build,
Additionally, if you use expo, make sure to add the expo-cli as a dev dependency: npm install -D expo-cli.
You will then simply need to push to heroku the usual way. By default, heroku will run yarn build (or npm run build depending on wether you used one or the other to generate your lock file).
In the end, here is what the package.json file might look like (using expo again):
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"test": "jest --watchAll",
"build": "expo build:web"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"#expo/vector-icons": "^12.0.0",
"#react-native-community/masked-view": "0.1.10",
"#react-navigation/bottom-tabs": "^5.11.1",
"#react-navigation/native": "^5.8.9",
"#react-navigation/stack": "^5.12.6",
"expo": "~40.0.0",
"expo-asset": "~8.2.1",
"expo-constants": "~9.3.0",
"expo-font": "~8.4.0",
"expo-linking": "~2.0.0",
"expo-splash-screen": "~0.8.0",
"expo-status-bar": "~1.0.3",
"expo-web-browser": "~8.6.0",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
"react-native-gesture-handler": "~1.8.0",
"react-native-safe-area-context": "3.1.9",
"react-native-screens": "~2.15.0",
"react-native-web": "~0.13.12"
},
"devDependencies": {
"expo-cli": "^4.0.16",
"#babel/core": "~7.9.0",
"#types/react": "~16.9.35",
"#types/react-native": "~0.63.2",
"jest-expo": "~40.0.0",
"typescript": "~4.0.0"
},
"private": true
}
And the Procfile simply consists of a single line:
web: npx serve web-build
You could probably achieve similar results using reactxp instead of reac-native-web, but I never tried it myself.
Client side routing
Configuring Heroku for client side routing
If you use client side routing (react navigation for example), you will have to setup a few more things to make sure linking works. With the previous build alone, client side routing will fail (404 errors) because heroku will try to route requests on its own, but your app needs everything to end up at index.html so it can perform routing tasks on its own (client side routing).
We will thus prevent any Heroku routing by adding a second buildpack heroku-community/static next to heroku/nodejs. This second buildpack is configured via a /static.json file (default values):
{
"root": "web-build/",
"clean_urls": false,
"routes": {
"/**": "index.html"
}
}
Configuring webpack for client side routing
You probably already have this part setup because otherwise you would have 404 errors even locally. To allow client side routing it seems like we also need to configure webpack (output.publicPath and devServer.historyApiFallback), with expo this can be done by running expo customize:web and then editing /webpack.config.js with:
const createExpoWebpackConfigAsync = require('#expo/webpack-config');
module.exports = async function (env, argv) {
const config = await createExpoWebpackConfigAsync(env, argv);
config.output.publicPath = '/';
config.devServer = {
...config.devServer,
historyApiFallback: true,
};
return config;
};
There is a nice article about these routing issues you might have here: Fixing the 'cannot GET /URL'
Steps for deploying React native/expo app to heroku:
1:
set heroku buildpack as static: >heroku buildpacks:set heroku-community/static
2:
Add static.json for static buildtype:
{
"root": "web-build/",
"routes": {
"/**": "index.html"
}
}
More settings here: https://github.com/heroku/heroku-buildpack-static#configuration
3:
npm run build (package.json: "build": "expo build:web") --> Creates web-build folder
git add .
git commit
git push heroku master
heroku open
I want install this.
I installed composer, set the environment variable path in w10.
Edit the composer.json located in this folder:
C:\Bitnami\wampstack-5.5.29-1\php\PEAR
with this content:
{
"name":"amazonwebservices/aws-sdk-for-php",
"description":"AWS SDK for PHP",
"keywords":["aws","amazon","sdk","s3","ec2","dynamodb"],
"type":"library",
"license":"Apache-2.0",
"authors":[
{
"name":"Amazon Web Services",
"homepage":"http://aws.amazon.com"
}
],
"homepage": "http://aws.amazon.com/sdkforphp/",
"require":{
"php":">=5.2.0"
},
"autoload":{
"classmap": [
"authentication/",
"extensions/",
"lib/",
"services/",
"utilities/",
"sdk.class.php"
]
}
}
{
"require": {
"katzgrau/klogger": "dev-master"
}
}
but when I execute this command in my console:
composer require katzgrau/klogger:dev-master
I get:
nothing to install or update
what I did wrong?
You are reusing the composer.json file of "aws-sdk-for-php".
That is probably not your project. And you are in the wrong folder (PEAR).
Don't copy and paste composer.json files... anyway:
Create a new project folder
then simply run composer require katzgrau/klogger:1.2.0
You'll get all dependencies fetched into the vendor folder and a fresh composer.json file for your project.
I have the following wiredep task:
gulp.task('wiredep', function () {
log('Installing Bower Components in HTML files...)
return gulp
.src('./Views/Shared/_Layout.cshtml')
.pipe(wiredep({
bowerJson: require('./bower.json'),
directory: './bower_components/',
ignorePath: '../..'
}))
.pipe(gulp.dest('.'));
});
The goal is to convert the
<!-- bower:js -->
<!-- endbower -->
to actual JavaScripts as specified in my bower.json:
{
"name": "ASP.NET",
"private": true,
"dependencies": {
"bootstrap": "3.0.0",
"hammer.js": "2.0.4",
"jquery": "2.1.4",
"knockout": "3.3.0"
}
}
When I run the task I get the following output:
[15:53:06] Starting 'wiredep'...
[15:53:06] Installing Bower Components in HTML files...
events.js:72
throw er; // Unhandled 'error' event
^
Error: Error: bootstrap is not installed. Try running `bower install` or remove the component from your bower.json file
I do see the packages in wwwroot/lib, so I think Bower is actually installing it.
Can anyone help me solve this?
this part of your script:
directory: './bower_components/',
is using the wrong path /bower_components/ is the default install folder for bower components (actually in beta 4 VS 2015 RC it used to put files there) but in the latest VS project template there is a file .bowerrc in the root of the app that tells it to put bower components under wwwroot/lib instead of the default folder name. so directory needs to be ./wwwroot/lib/' I think.