Perguntas com a tag [webpack]
O _Webpack_ é um compilador de módulos. Sua finalidade principal é agrupar arquivos JavaScript para uso em um navegador, mas também é capaz de transformar, compilar e agrupar basicamente qualquer outro tipo de arquivo ou recurso, como `sass`, `less`, `css`, `html` entre outros.
70
perguntas
13
votos
1
resposta
540
visitas
Performance Webpack Build.js
Estou iniciando com Webpack. Ele compila todos os arquivos javascript e css em um único arquivo Build.js, Bundle.js, o que seja... No fim ele gera um arquivo totalmente minificado utilizando o comando ...
4
votos
1
resposta
593
visitas
Como melhorar a performance do angular com webpack ou carregamento por demanda?
Tenho um projeto grande com angular e preciso deixar os carregamento das paginas com uma boa performance, de principio configurei um WebPack Customizado para a aplicação. Mas ao aplica-lo os arquivos ...
4
votos
1
resposta
474
visitas
Como desabilitar as mensagens do XHR finished loading em produção
Tenho um sistema desenvolvido na linguagem Angular na versão 4. O sistema que gera build da aplicação em produção é o webpack. Esta sendo utilizado como base o seguinte starter:
angular 4 webpack ...
3
votos
1
resposta
305
visitas
Concatenar vários ficheiros sass/css em um só css final
Estou a usar laravel 5.4, que por default traz um ficheiro webpack.mix.js que serão os ficheiros a serem concatenados e o seu destino.
O meu problema é concatenar ficheiros scss com css, o que tenho ...
3
votos
1
resposta
286
visitas
como gerar um index.js a cada build - WebPack
Estou trabalhando em um projeto nuxt/vue.js e aplicando a metodologia do design atomic, então eu terei muuuittos componentes, em diferentes pastas, exemplo:
├── components
│ ├── quarks
│ │ └── ....
3
votos
3
respostas
1mil
visitas
Webpack não atualizando bundle.js
Sou novo nessa coisa de React e Webpack, e estou estudando bastante, mas cheguei num problema que não estou encontrando um modo de resolver.
const webpack = require('webpack')
module.exports = {
...
3
votos
0
respostas
361
visitas
vue-html-loader (Webpack+Vue-loader) não encontra às imagens na pasta raíz
Estou com dificuldade em anexar as imagens contidas no src do HTML5 dentro de uma rota feita no vue-router, pois o Webpack não encontra a imagem que está na raiz o projeto, veja a estrutura:
C:.
| ...
2
votos
1
resposta
88
visitas
importação de script na ordem errada, function not defined
Eu tenho um component vue (Map.vue):
<template>
...
</template>
<script>
import '../../assets/js/map.js'
export default {
name: 'home',
data () {
return {
...
2
votos
1
resposta
280
visitas
Produção vs Desenvolvimento - WEBPACK
Gostaria de saber qual a diferença entre os modos de "development" e "production" dentro do Webpack4.
2
votos
1
resposta
122
visitas
Webpack Otimização de Minificação
Estou iniciando com o Webpack e estou aprendendo como mexer no Config dele, e vi uma parte da documentação que trata à respeito de Resolve.extentions, achei bem legal porque você consegue ocultar as ...
2
votos
1
resposta
333
visitas
WebPack + NodeJS import bootstrap + jquery
Olá pessoal da Stackoverflow,
Estou com um projeto VueJS já com Webpack. E fui importar as bibliotecas JQuery e Bootstrap. Fui no meu node e usei os comandos
npm install jquery --save-dev
npm ...
2
votos
0
respostas
78
visitas
Problemas com renderização Vue Router 4 + Vue 3 (versão de compatibilidade)
Contexto
Estou migrando minha aplicação de vue 2 para vue 3, e estou usando a versão de compatibilidade (migration build).
Minha aplicação é uma WebExtension (extensão de navegador).
Fluxo da ...
2
votos
0
respostas
66
visitas
Chamar classes a partir de strings em módulos ES6 (commonjs) compilados pelo Webpack
Em um projeto web com TypeScript, utilizando módulos commonjs, compilados através do Webpack (versão 5), necessito chamar classes e métodos dinamicamente a partir de variáveis do tipo string contendo ...
2
votos
0
respostas
165
visitas
Definir a url(path) ao importar fontawesome com sass
Olá!
Estou trabalhando com node+webpack+sass. Quando executo o script do wabpack, é feita a compilação do sass, o bundle dos arquivos js e o resultado é todo colocado no diretório build/. Ate ai sem ...
2
votos
0
respostas
479
visitas
Como configuro o WebPack e arquivo package.json para rodar o projeto React?
Fiz todas as configurações necessárias do WebPack e o projeto inicia, porém aparentemente não roda o css no projeto e só fica uma tela em branco. Antes das configurações do WebPack meu Package.json ...
2
votos
0
respostas
95
visitas
Webpack importar css junto com component REACTJS
Olá,
estou fazendo um component (REACTJS), gostaria de ao importar o css viesse.
Estou utilizando o css-loader e style-loader.
Como nunca tinha feito algo assim, não sei se a configuração está ...
2
votos
2
respostas
1mil
visitas
Atribuir o retorno de uma função que retorna de uma Promise
Estou exportando uma função para outro arquivo que está como um componente Webpack-simple + VueJS. Essa é a função do arquivo api-user.js:
export function getUsers () {
axios.post('/api/get_list',{...
2
votos
0
respostas
972
visitas
Como executar o webpack + ReactJS sem node.js no client-side?
É possível rodar o transpilador do webpack no client-side sem a instalação e execução do mesmo em um servidor Node.js ?
Atualmente estou tentando implementar uma aplicação SPA utilizando React 15.1.0 ...
1
voto
1
resposta
744
visitas
Criar componente para ser usado via npm
Comecei a trabalhar muito com vue e passei a utiliza-lo em todos os projetos na empresa em que trabalho. E com isso, acabei criando alguns componentes, em geral autocomplete, sei que existem muitos, ...
1
voto
3
respostas
1mil
visitas
Como usar ancora no vuejs/vue-loader?
Estou criando um projeto com vuejs webpack (vue-loader) e recentemente me deparei com um problema, não consigo ancorar nenhuma tag, pois o vue entende que ao usar o hash #, vc esta querendo direcionar ...
1
voto
1
resposta
2mil
visitas
Erro com Webpack (yarn webpack-dev-server --mode development)
Estou tentando criar minha primeira aplicação ReactJS.
Quando executo no terminal bash do VSCode o seguinte comando:
yarn webpack-dev-server --mode development
Aparece o seguinte erro:
$ yarn webpack-...
1
voto
1
resposta
924
visitas
Como usar Material Icons com next.js?
import Link from 'next/link';
import MaterialIcon from 'material-icons-react';
const Header = (props) => {
return (
<nav>
<ul>
{navOptions.map(nav => (
...
1
voto
1
resposta
364
visitas
React build vs (?) Webpack?
Estou fazendo um curso de React. Tenho a compreensão do que o React é, e qual problema ele resolve.
Contudo quando eu coloco no CMD "create-react-app x" ele mostra alguns outros comandos que posso ...
1
voto
2
respostas
208
visitas
Como importar um arquivo inteiro (javascript) com WebPack?
Eu comecei estudar WebPack agora, consegui usa-lo normalmente, porém, quando eu quero importar algo de outro arquivo eu preciso dar:
import {abc} from './my-file.js';
e no arquivo que foi importado: ...
1
voto
1
resposta
1mil
visitas
Comandos do WEBPACK não funcionam
instalei o webpack com o comando npm install webpack -g , porem quando tento usar o comando o webpack -h ou outro qualquer da esse problema
> PS C:\Users\renan\Desktop\Wchat> webpack -h The CLI ...
1
voto
1
resposta
557
visitas
Webpack + sass gerando style.css
Porque o webpack na hora de realizar o extract nos arquivos .scss, ele cria o arquivo styles.css tudo certo na pasta dist/css, mas ele retira as aspas e pontos do caminho de uma foto por exmplo: ...
1
voto
1
resposta
753
visitas
Gerar vários arquivos .js com webpack
Preciso criar vários arquivos .js um para cada arquivo .ts, mas não sei como configurar o webpack 2 para fazer este procedimento.
var path = require('path');
var ExtractTextPlugin = require('extract-...
1
voto
1
resposta
301
visitas
Erro webpack com bootstrap-loader
Estou com dificuldades para implementar o bootstrap-loader no webpack. Recebo está saída de erro no console:
ERROR in
./~/css-loader!./~/resolve-url-loader!./~/sass-loader?sourceMap!./~/bootstrap-...
1
voto
2
respostas
1mil
visitas
'webpack-dev-server' module not found
Ao tentar executar yarn webpack-dev-server --mode development
o seguinte erro aparece:
$ C:\Users\Coding\code\frontend\node_modules\.bin\webpack-dev-server --mode development
internal/modules/cjs/...
1
voto
0
respostas
172
visitas
Erro HTML Loader no electron-webpack
Estou buscando uma solução para rodar; electron e react seguindo uma estrutura MVC. Achei o módulo electron-webpack que aparentemente extende sobre webpack padrão.
Seguindo a documentação configurei ...
1
voto
0
respostas
84
visitas
Não consigo utilizar as funções que exportei com o modulo!
ao utilizar o export default class no javascript,
não estou conseguindo usar as funções que importei.
Retorno no inspect do navegador
Segue arquivos:
index.js
/* global fetch */
import API_URL ...
1
voto
0
respostas
1mil
visitas
Não consigo acessar meu projeto Vue CLI pelo IP
Eu inicio meu projeto Vue CLI (template webpack) pelo terminal com npm run dev e inicializa tudo normal.
Consigo acessar meu projeto web pelo localhost ou 127.0.0.1, mas quando tento acessar pelo ip ...
1
voto
0
respostas
142
visitas
Webpack não usa o Babel para transpilar
Sempre que executo o build do meu projeto, a saída é sempre o arquivo gerado pelo webpack, sem sinais que tenha passado pelo Babel.
As minhas configurações estão assim:
package.json
{
"name": "...
1
voto
1
resposta
294
visitas
Angular: Erro em módulos do sistema
Olá! Minha aplicação parou de compilar, dando problemas em módulos de uso geral. O módulo crypto, foi o primeiro erro que apareceu, então procurei uma solução para este erro.
A solução que eu ...
1
voto
0
respostas
124
visitas
ASP.NET Core NPM e webpack/gulp
Criei um projeto no asp.net core usando o template empty (dotnet new web).
Pelo que pesquisei, para adicionar pacotes como Bootstrap ou jquery, temos que usar o NPM, que basicamente é adicionar o ...
1
voto
1
resposta
78
visitas
Webpack ReactJS
Estou enfrentando problemas com meu webpack, recebo no terminal esse seguinte erro:
you may need an appropriate loader to handle this file type
webpack.config.js:
var path = require('path');
var ...
1
voto
0
respostas
82
visitas
Como definir o diretório images e fonts no Laravel-mix?
Estou utilizando o Laravel-mix em um projeto pessoal, porém, sem a presença do Framework Laravel. Quando mando gerar os arquivos o Laravel-mix lê os arquivos sass e cria na raiz do projeto um ...
1
voto
1
resposta
122
visitas
webpack localhost/sockjs.js.map not found
Estou com o seguinte erro referente a socks.js.map, alguém pode me ajudar ?
Failed to load resource: the server responded with a status of 404
(Not Found)
instalei a versão mais recente do ...
1
voto
1
resposta
110
visitas
Dynamic Import com Webpack
Em uma aplicação VueJS com template Webpack, tenho a necessidade de importar uma série de SVG's de acordo com os parâmetros de um usuário.
Os SVG's são arquivos fixos, mas são carregados ...
1
voto
1
resposta
128
visitas
Estou tendo o problema com webpack 404 "cannot get". O que pode ser?
Aqui meu config:
var path = require('path');
const webpack = require('webpack');
const publicPath = '/dist/assets/';
module.exports = {
entry: './src/index.js',
devtool: 'cheap-module-source-...
1
voto
0
respostas
33
visitas
Remover string "dist" de build com Webpack
criei uma rule no meu arquivi webpack.config.js para poder trabalhar com fontes dentro do meu scss, porém quando faço o build para produção a string para carregar o arquivo fica como:
/distfonts/...
1
voto
0
respostas
34
visitas
Erro no npm run watch - Cannot read property 'install' of undefined
Esse erro ocorre quando faço um "npm run watch".
Quando faço um "npm run dev", não da este erro.
Ja reinstalei todo o npm e não resolveu...
alguma solução?
0
votos
1
resposta
941
visitas
Como configurar o arquivo webpack no Laravel?
Estou seguindo vários tutoriais como podem ver abaixo;
Aos 9 minutos e 45 segundos de vídeo.
Utilização do Vue.js em uma aplicação Laravel
Aos 8 minutos e 12 segundos do vídeo.
1 - CRUD en LARAVEL ...
0
votos
1
resposta
2mil
visitas
Erro em npm run dev
Estou tentando executar o comando npm run dev em um projeto desenvolvido por outra pessoa.
Esse é a configuração no package.json:
"scripts": {
"dev": "npm run development",
"development": "...
0
votos
1
resposta
530
visitas
Duvida sobre arquivo gerado após usar npm run build com vue-cli + webpack
Estou estudando e desenvolvendo uma spa, e reparei que ao usar o comando npm run build ele gera dois arquivos app.js e app.map.js não intendi o por que desse arquivo .map alguem consegue me explicar o ...
0
votos
1
resposta
730
visitas
Iniciar Projeto Vue a partir de template existente
É possivel iniciar um projeto Vue a partir de um template já existente? Quero criar um template com todas as dependencias necessarias e configurações inicias (assim como paginas e etc), para que ...
0
votos
2
respostas
443
visitas
Instalar StartBootstrap-SB-Admin usando Yarn
Estou criando um esqueleto base para minhas aplicações e pretendo usar Symfony 4 e Startbootstrap-SB-Admin.
Já tenho um projeto esqueleto usando Symfony 3 e SB-Admin-2 e mais outro com Silex. Esses ...
0
votos
0
respostas
173
visitas
Problemas com a atualização de um projeto angular para a versão 7
Estou com um problema na atualização de um projeto angular para o angular 7 e não estou sabendo resolver.
O meu projeto já funciona o npm i mas quando eu tento executar o projeto ele aponta o seguinte ...
0
votos
0
respostas
34
visitas
Pacote ES6 só funciona no primeiro carregamento - webpack
Construí um pacote baseado em CSS3 / CSS4, HTML5 e suas APIs, o pacote contém 101 arquivos e usa promessas para diferenciar os arquivos e medir sua prioridade, ao final de uma promessa, você pode ou ...
0
votos
1
resposta
75
visitas
Criar alias para imports de css
Tenho um projeto react que usa typescript e gostaria de ter alguma forma de importar css sem colocar o caminho todo do local do css.
Gostaria de evitar esse tempo de import:
@import '../../../../...