Adding folder paths to bud.config.js in .entry

sage
,
1

I wanted to create a react folder in the resources folder, and have spent a couple of hours playing with .setPath('@react', './resources/react') followed by .alias('@react', app.path('@react')) based on the documentation.

I don’t know if I’m misunderstanding something, or missing something entirely, but when I go to compile the scripts, the error I get is [bud@5.8.7] [bud] › ✖ '@' is not a registered path. It must be defined with bud.setPath

This is the whole block, which I’ve tried adjusting the .setPath, and the alias about:

module.exports = async (app) => {
//    app.setPath('@react', './resources/react')
//          .alias('@react', app.path('@react'))

    app
        .setPath('@react', './resources/react')
        .alias('@react', app.path('@react'))
        .entry({
            app: ["@scripts/app", "@styles/app"],
            editor: ["@scripts/editor", "@styles/editor"],
            react: ["@react/app"]
        })
        .assets("images")
        .watch("resources/views/**/*", "app/**/*")        
        .proxy("http://example.test")
        .serve("http://0.0.0.0:3000");
};
2

What are you trying to accomplish with your use of .alias()? If all you want is the ability to do this:

react: ["@react/app"]

Then

app.setPath('@react', './resources/react')

should be sufficient.

If what you’re trying to do is use a react alias in your scripts (i.e. import { Something } from 'react/file') then I’m pretty sure you’re calling alias wrong. It should be:

.alias('react', app.path('@react'))

That is, without the @.

3

All I’m simply trying to do is compile the JS files in resources/react. I was trying to model after what the @scripts and @styles is setup as, but sadly the documentation wasn’t fully clear on how these are set up, so I assumed they were alias’.

I tried this method here:

app
    .setPath('@react', './resources/react')
    .entry({
        app: ["@scripts/app", "@styles/app"],
        editor: ["@scripts/editor", "@styles/editor"],
        react: ["@react/app"]
    })

However, this is what I get in terminal

[bud@5.8.7] [bud] › ✖  ModuleNotFoundError: Module not found: Error: Can't resolve '@react/app' in '[secure]'

If I change react: ["@react/app"] to react: ['./resources/react/app'] then everything works fine, but I was trying to keep to how @roots/sage is doing it.

4

Was wondering if you had more insight to my reply above.

5

Checking in on this again to see if you can provide any insight to my reply above

6

Coming back to this, as no response since June, this is what I ended up doing. I think there’s some sort of conflict with @react or @vue which makes sense, but I was able to get the alias’ setup like so:

.alias({
    "@sageReact": "@src/react", // done this way so you can create multiple alias'
})

/**
  * Application entry points
  *
  * Paths are relative to your resources directory
  */
.entry({
    app:    ["@scripts/app", "@styles/app"],
    editor: ["@scripts/editor", "@styles/editor"],
    react:  ["@sageReact/app"],
})