CODEWITHSUNDEEP
node.jsreactjsmavennpmyarnpkg
Richard Brescher
Richard Brescher

Reputation: 505

How do I switch from npm to yarn in my project?

I'm having an issue trying to switch to yarn from npm inside my project. I tried downloading yarn and I'm still getting npm to start my project. I need to switch because a project I'm working on needs it to be yarn so I can add a maven frontend plugin to tie my backend and frontend to gather for deployment.

enter image description here

1.
<frontend-maven-plugin.version>1.6</frontend-maven-plugin.version>
<node.version>v10.13.0</node.version>
<yarn.version>v1.12.1</yarn.version>

2.
<profiles>
    <profile>
        <id>demo</id>
        <build>
            <plugins>

                <plugin>
                    <groupId>com.github.eirslett</groupId>
                    <artifactId>frontend-maven-plugin</artifactId>
                    <version>${frontend-maven-plugin.version}</version>
                    <configuration>
                        <workingDirectory>src/js</workingDirectory>
                    </configuration>
                    <executions>
                        <execution>
                            <id>install node</id>
                            <goals>
                                <goal>install-node-and-yarn</goal>
                            </goals>
                            <configuration>
                                <nodeVersion>${node.version}</nodeVersion>
                                <yarnVersion>${yarn.version}</yarnVersion>
                            </configuration>
                        </execution>
                        <execution>
                            <id>yarn install</id>
                            <goals>
                                <goal>yarn</goal>
                            </goals>
                            <phase>generate-resources</phase>
                        </execution>
                        <execution>
                            <id>yarn test</id>
                            <goals>
                                <goal>yarn</goal>
                            </goals>
                            <phase>test</phase>
                            <configuration>
                                <arguments>test</arguments>
                                <environmentVariables>
                                    <CI>true</CI>
                                </environmentVariables>
                            </configuration>
                        </execution>
                        <execution>
                            <id>yarn build</id>
                            <goals>
                                <goal>yarn</goal>
                            </goals>
                            <phase>compile</phase>
                            <configuration>
                                <arguments>build</arguments>
                            </configuration>
                        </execution>
                    </executions>
                </plugin>
                <plugin>
                    <artifactId>maven-resources-plugin</artifactId>
                    <executions>
                        <execution>
                            <id>copy-resources</id>
                            <phase>process-classes</phase>
                            <goals>
                                <goal>copy-resources</goal>
                            </goals>
                            <configuration>
                                <outputDirectory>${basedir}/target/classes/static</outputDirectory>
                                <resources>
                                    <resource>
                                        <directory>src/js/build</directory>
                                    </resource>
                                </resources>
                            </configuration>
                        </execution>
                    </executions>
                </plugin>
            </plugins>
        </build>
    </profile>
</profiles>

Link1 https://github.com/amigoscode/spring-boot-react-fullstack/blob/app-0/course-files/profiles.txt Link2 https://github.com/eirslett/frontend-maven-plugin

Upvotes: 37

Views: 56761

Answers (3)

Sebastian Vorac
Sebastian Vorac

Reputation: 4693

Full simple step-by-step answer:

  1. Install yarn npm i -g yarn
  2. Go to directory where u install packages and run yarn command
  3. Yarn will init and create its yarn.lock file, now delete package-lock.json * Note
  4. In your package.json file replace in "scripts" all npm commands for yarn ** Note
  5. Run yarn dev or whatever command u use for running a yarn script => DONE

* Note: it is important you don't delete it before yarn command (as some people suggest) it can break things, for example your yarn command will not even work and it will throw error:

Error: ENOENT: no such file or directory, open './package-lock.json'

** Note: If you used

 "preinstall": "npx npm-force-resolutions",

you can remove it, yarn is taking "resolutions" by default without a need for force :)

Upvotes: 55

Momo Setti
Momo Setti

Reputation: 337

It's quite simple; follow those instructions:

  1. Verify that Yarn is installed on your machine globally, else use npm install -g yarn to install it.
  2. Go to your root project directory and type yarn on your CLI; Yarn can consume the same package.json format as npm, and can install any package from the npm registry.

For more details, check the official yarn doc.

Upvotes: 22

Arnab
Arnab

Reputation: 961

You need not to do anything to switch from npm to yarn as long as yarn is installed in your Computer. Also to install packages using yarn, you should run the command yarn rather than yarn install which is equivalent to npm install. Because yarn is nothing stand alone library. Yarn is only a new CLI client that fetches modules from the npm registry. Nothing about the registry itself will change — you’ll still be able to fetch and publish packages as normal.

For more information about yarn you should read This

Upvotes: 6

Related Questions